<template>
    <div class="log">
        <div class="scorll">
            <div class="content">
                <div class="headerBox">
                    <div class="tabs">
                        <Tabs v-if="dataFlag" v-model="tabActiveName" @on-click="getModuleFn" style="overflow: visible">
                            <template v-for="(item, index) in moduleList">
                                <TabPane :label="item.name" :name="String(item.id)" v-if="item.flag" :key="index"></TabPane>
                            </template>
                        </Tabs>
                        <span v-if="!dataFlag">暂无模块,请前让管理配置相应模块</span>
                    </div>
                    <div class="time" v-if="dataFlag">
                        <div class="timeBox">
                            <div class="arrow_left" @click="prevFn">
                                <Icon type="md-arrow-dropleft" />
                            </div>
                            <div class="time_center">
                                <DatePicker placement="top" type="date" :options="options" :editable="false" :clearable="false" placeholder="请选择日期" style="width: 100%" format="yyyy-MM-dd" v-model="day" @on-change="getData"></DatePicker>
                            </div>
                            <div class="arrow_right" v-show="!timeFlag" @click="nextFn" >
                                <Icon type="md-arrow-dropright" />
                            </div>
                            <div class="arrow_right" v-show="timeFlag">
                                <Icon type="md-arrow-dropright" style="color: #eee; cursor: not-allowed" />
                            </div>
                        </div>
                    </div>
                </div>
                <div class="box" ref="boxScroll" id="boxScroll">
                    <!-- 人员日志 -->
                    <div class="com_box" id="module0" v-if="ModalList.includes('prj/log-emp')">
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb2.svg"/>人员日志</div>
                            <el-button type="text" @click="toDetails('emp')" >详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item">
                                <div class="mach_item_top">
                                    <span>人员统计</span>
                                </div>
                                <div class="mach_item_bottom">
                                    <div class="machBorder">
                                        <div class="machBorderRadius"></div>
                                        <div class="wave_box">
                                            <div class="wave1"></div>
                                            <div class="wave2"></div>
                                            <div class="wave3"></div>
                                        </div>
                                    </div>
                                    <div class="num numText">{{ empObj.empTotal }}人</div>
                                    <div class="round">
                                        <div class="text">在职人员</div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item emp_attend_list">
                                <div class="mach_item_top">
                                    <span>今日出勤</span>
                                </div>
                                <div class="mach_list_bottom">
                                    <div class="canvas">
                                        <div class="mach_item_bottom machRing" ref="round">
                                            <div id="attendManager" style="position: relative">
                                                <el-progress
                                                    type="circle"
                                                    :percentage="empObj.attendManagerRate"
                                                    :stroke-width="12"
                                                    color="#3BA1FF"
                                                    :width="progressWidth"
                                                ></el-progress>
                                                <div class="progress_text">出勤率</div>
                                            </div>
                                        </div>
                                        <div class="mach_item_bottom machRing">
                                            <div id="attendWorker" style="position: relative">
                                                <el-progress
                                                    type="circle"
                                                    :percentage="empObj.attendWorkerRate"
                                                    :stroke-width="12"
                                                    color="#6AD389"
                                                    :width="progressWidth"
                                                ></el-progress>
                                                <div class="progress_text">出勤率</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="info">
                                        <div class="info_list">
                                            <div class="info_item">
                                                <span class="radius" style="background: #3ba1ff"></span>
                                                <span class="name">今日总出勤人数</span>
                                                <span class="sub">
                                                    <span class="blue">{{ empObj.attendManagerNum + empObj.attendWorkerNum }}</span>
                                                    <span>人</span>
                                                </span>
                                            </div>
                                            <div class="info_item">
                                                <span class="radius" style="background: #6ad389" ></span>
                                                <span class="name">今日总出勤率</span>
                                                <span class="sub">
                                                    <span class="blue">
                                                        {{ empObj.empTotal > 0 ? (((empObj.attendManagerNum + empObj.attendWorkerNum) / empObj.empTotal) * 100).toFixed(2) : 0.0 }}
                                                    </span>
                                                    <span>%</span>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="progressList">
                                    <div class="progress_item">
                                        <div class="text">管理人员：</div>
                                        <div class="num">
                                            <span class="blue">{{ empObj.attendManagerNum }}</span>
                                            <span>人</span>
                                        </div>
                                    </div>
                                    <div class="progress_item">
                                        <div class="text">施工人员：</div>
                                        <div class="num">
                                            <span class="blue">{{ empObj.attendWorkerNum }}</span>
                                            <span>人</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item emp_change_list">
                                <div class="mach_item_top">
                                    <span>人员变动</span>
                                </div>
                                <div class="emp_change_bottom">
                                    <div class="emp_change_bottom_item">
                                        <div class="canvas">
                                            <div class="emp_canvas">
                                                <div class="personnelChart" id="personnelChart1"></div>
                                                <div class="round">
                                                    <div class="text">今日入职</div>
                                                </div>
                                                <div class="num"><p>{{ empObj.enterList.length }}</p>总人数(人）</div>
                                            </div>
                                            <div class="emp_box" id="enterSlide" style="height:1.6rem;padding-left:0" @mouseover="enterOver" @mouseleave="enterLeave">
                                                <div class="emp_list" id="enterSlide1">
                                                    <div class="emp_item" v-for="(item, index) in empObj.enterList" :key="index" >
                                                        <div class="p">
                                                            <span>{{ item.groupName ? item.groupName : "—" }}</span>
                                                            <span style="color: #1891FF;" >{{ item.empName ? item.empName : "—" }}</span>
                                                        </div>
                                                    </div>
                                                    <template v-if="empObj.enterList.length > 5" >
                                                        <div class="emp_item" v-for="(item, index) in empObj.enterList" :key="index + empObj.enterList.length" >
                                                            <div class="p">
                                                                <span>{{item.groupName ? item.groupName : "—" }}</span>
                                                                <span style="color: #1891FF;">{{ item.empName ? item.empName : "—" }}</span>
                                                            </div>
                                                        </div>
                                                    </template>
                                                </div>
                                                <div class="emp_list" id="enterSlide2" v-if="empObj.enterList.length > 5" ></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="emp_change_bottom_item">
                                        <div class="canvas">
                                            <div class="emp_canvas">
                                                <div class="personnelChart" id="personnelChart2"></div>
                                                <div class="round">
                                                    <div class="text">今日离职</div>
                                                </div>
                                                <div class="num"><p>{{ empObj.outerList.length }}</p>总人数(人）</div>
                                            </div>
                                            <div class="emp_box" id="outerSlide" style="height:1.6rem;padding-left:0" @mouseover="outerOver" @mouseleave="outerLeave">
                                                <div class="emp_list" id="outerSlide1" >
                                                    <div class="emp_item" v-for="(item, index) in empObj.outerList" :key="index" >
                                                        <div class="p">
                                                            <span>{{ item.groupName }}</span>
                                                            <span style=" color: #1891FF;" >{{ item.empName }}</span>
                                                        </div>
                                                    </div>
                                                    <template v-if="empObj.outerList.length > 5" >
                                                        <div class="emp_item" v-for="(item, index) in empObj.outerList" :key="index + empObj.outerList.length" >
                                                            <div class="p">
                                                                <span>{{ item.groupName }}</span>
                                                                <span style="color: #1891FF;">{{ item.empName }}</span>
                                                            </div>
                                                        </div>
                                                    </template>
                                                </div>
                                                <div class="emp_list" id="outerSlide2" v-if="empObj.outerList.length > 5"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-emp')"></div>
                    <!-- 视频日志 -->
                    <div class="com_box" id="module1" v-if="ModalList.includes('prj/log-fvs')">
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb6.svg"/>视频日志</div>
                            <el-button type="text" @click="toDetails('fvs')" >详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item">
                                <div class="mach_item_top">
                                    <span>设备统计</span>
                                </div>
                                <div class="mach_item_bottom">
                                    <div class="flowerPicture">
                                        <div class="picture1"></div>
                                        <div class="num" :style="{textIndent:fvsObj.deviceNum>9&&fvsObj.deviceNum<20?'-0.22rem':'0'}">{{fvsObj.deviceNum}}</div>
                                    </div>
                                    <div class="text">设备总数(台)</div>
                                </div>
                            </div>
                            <div class="mach_item">
                                <div class="mach_item_top">
                                    <span>抓拍统计</span>
                                </div>
                                <div class="mach_item_bottom">
                                    <div class="flowerPicture">
                                        <div class="picture1 picture2"></div>
                                        <div class="num num1" :style="{textIndent:fvsObj.captureNum>9&&fvsObj.captureNum<20?'-0.22rem':'0'}">{{fvsObj.captureNum}}</div>
                                    </div>
                                    <div class="text">抓拍总数(次)</div>
                                </div>
                            </div>
                            <div class="mach_item fvs_list">
                                <div class="mach_item_top">
                                    <span>预警统计</span>
                                    <span>（总预警次数：</span>
                                    <span style="color: #1891FF">{{fimWarningCunt > 99? "99+": fimWarningCunt}}）</span>
                                </div>
                                <div class="mach_item_bottom" style="display: block">
                                    <div class="overflowBox" v-if="fimWarningList && fimWarningList.length > 0">
                                        <div :class="['box_left', fimIndex == 0 ? 'hiddeClass' : '']" v-preventReClick="1500" @click="fimPrevFn">
                                            <img src="../../assets/svg/changeRight.svg" />
                                        </div>
                                        <div
                                            :class="['box_right', fimIndex == fimWarningList.length - 5 ? 'hiddeClass' : '']"
                                            v-preventReClick="1500"
                                            @click="fimNextFn"
                                        >
                                            <img src="../../assets/svg/changeLeft.svg" />
                                        </div>
                                        <div class="boxList">
                                            <div class="env_box" :style="{left: -fimIndex * 2.3 + 'rem'}">
                                                <div v-for="(item, index) in fimWarningList" :key="index" class="fvs_item">
                                                    <div class="fvs_item_left">
                                                        <img src="../../assets/images/prj/log/log_fvs_statistics_icon.png" class="icon" />
                                                    </div>
                                                    <div class="fvs_item_right">
                                                        <div class="fvs_item_right_top">{{ item.name }}</div>
                                                        <div class="fvs_item_right_bottom">
                                                            {{ item.count && item.count > 99 ? "99+" : item.count}}
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="boxSlider" v-if="fimWarningList.length>4">
                                            <div v-for="(item,index) in (fimWarningList.length-4)" :key="index" :class="fimIndex===index?'active':''"></div>
                                        </div>
                                    </div>
                                    <div class="data_none" v-else>暂无数据</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-fvs')"></div>
                    <!-- 环境日志 -->
                    <div class="com_box" id="module2" v-if="ModalList.includes('prj/log-env')">
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb5.svg"/>环境日志</div>
                            <el-button type="text" @click="toDetails('env')" >详情 <span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item env_left">
                                <div class="mach_item_top">
                                    <!-- <img src="../../assets/images/prj/log/log_env_statistics_icon.png" alt="" class="icon"/>-->
                                    <span>设备统计</span>
                                </div>
                                 <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class="quality_item_bottom_box mach_list_bottom">
                                        <div class="canvas" style="width:100%;">
                                            <div id="environmentName" :style="{ height: '1.82rem', width: '1.82rem',paddingLeft:'0.1rem'}" ></div>
                                            <div class="emp_box">
                                                <div class="emp_list" id="safetyReportSlide1">
                                                    <div class="emp_item" v-for="(item, index) in envObj.deviceTypeCountList" :key="index">
                                                        <div class="p" style="display: flex;align-items: center;justify-content: flex-start;">
                                                            <span class="radius" :style="[{background:colors2[index],},]"></span>
                                                            <span class="name">{{item.deviceName}}</span>
                                                            <span class="sub" style="width: 0.5rem;">
                                                            <span class="blue">{{item.count}}</span>台</span>
                                                        </div>
                                                    </div>
                                                    <template v-if="safetyReportList.length > 5">
                                                        <div class="emp_item" v-for="(item, index) in safetyReportList" :key="index + safetyReportList.length">
                                                            <div class="p" style="display: flex;align-items: center;justify-content: flex-start;">
                                                                <span class="radius" :style="[{background: colors[index],},]"></span>
                                                                <span class="name">{{item.name}}</span>
                                                                <span class="sub" style="width: 0.5rem;">
                                                                <span class="blue">{{item.value}}</span></span>
                                                                <span class="sub" style="width: 1rem;margin-right: 0;">
                                                                    <span class="blue">{{item.value > 0 ? ((item.value / safetyObj.questionNum) * 100).toFixed(2) : 0}}</span>
                                                                    <span style="margin-right: 0;">%</span>
                                                                </span>
                                                            </div>
                                                        </div>
                                                    </template>
                                                </div>
                                                <div class="emp_list" id="safetyReportSlide2" v-if="safetyReportList.length > 5"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="mach_item env_list">
                                <div class="mach_item_bottom" style="display: block">
                                    <div class="overflowBox" v-if="resEnvList.length > 0">
                                        <div v-if="resEnvList.length > 4" :class="['box_left', envIndex == 0 ? 'hiddeClass' : '',]" v-preventReClick="1500" @click="envPrevFn">
                                            <img src="../../assets/svg/changeRight.svg"/>
                                        </div>
                                        <div v-if="resEnvList.length > 4" :class="['box_right',envIndex == resEnvList.length - 4 ? 'hiddeClass' : '',]" v-preventReClick="1500" @click="envNextFn">
                                            <img src="../../assets/svg/changeLeft.svg"/>
                                        </div>
                                        <div class="boxList" style="height:1.6rem">
                                            <div class="env_box" :style="{ left: -envIndex * 3 + 'rem',}">
                                                <div v-for="(item, index) in resEnvList" :key="index" class="env_item">
                                                    <div class="env_item_top">{{ item.name }}</div>
                                                    <div class="env_item_bottom">
                                                        <p>
                                                            <span>最大值：</span>
                                                            <span class="num" style="color: #1891FF;" v-if="item.name =='风力'">{{item.max && item.max.maxSpeed && item.max != undefined ? item.max.maxSpeed : "—"}}</span>
                                                            <span class="num" style=" color: #1891FF;" v-else>{{item.max != undefined ? item.max : "—"}}</span>
                                                            <span v-if="index == 0 || index == 1 || index == 7">μg/m³</span>
                                                            <span v-if="index == 2">db</span>
                                                            <span v-if="index == 3">℃</span>
                                                            <span v-if="index == 4">%</span>
                                                            <span v-if="index == 5">级</span>
                                                            <span v-if="index == 6">m/s</span>
                                                            <span v-if="index == 8">kPa</span>
                                                        </p>
                                                        <p>
                                                            <span>最小值：</span>
                                                            <span class="num" style=" color: #1891FF;" v-if="item.name == '风力'">{{item.min && item.min.minSpeed && item.min != undefined ? item.min.minSpeed : "—"}}</span>
                                                            <span class="num" style="color: #1891FF;" v-else>{{item.min != undefined ? item.min : "—"}}</span>
                                                            <span v-if="index == 0 || index == 1 || index == 7">μg/m³</span>
                                                            <span v-if="index == 2">db</span>
                                                            <span v-if="index == 3">℃</span>
                                                            <span v-if="index == 4">%</span>
                                                            <span v-if="index == 5">级</span>
                                                            <span v-if="index == 6">m/s</span>
                                                            <span v-if="index == 8">kPa</span>
                                                        </p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="boxSlider">
                                            <div v-for="(item,index) in (resEnvList.length-3)" :key="index" :class="envIndex===index?'active':''"></div>
                                        </div>
                                    </div>
                                    <div class="data_none" v-else>暂无数据</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-env')"></div>
                    <!-- 设备日志 -->
                    <!-- <div class="com_box" id="module3" v-if="ModalList.includes('prj/log-mach')" >
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb1.svg"/>设备日志</div>
                            <el-button type="text" @click="toDetails('mach')" >详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item">
                                <div class="mach_item_top">
                                    <span>设备统计</span>
                                </div>
                                <div class="mach_item_bottom">
                                    <div class="machBorder">
                                        <div class="machBorderRadius"></div>
                                        <div class="wave_box">
                                            <div class="wave1"></div>
                                            <div class="wave2"></div>
                                            <div class="wave3"></div>
                                        </div>
                                    </div>
                                    <div class="num numText">{{ machObj.totalMachNum }}台</div>
                                    <div class="round">
                                        <div class="text">入网设备</div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item mach_list">
                                <div class="mach_item_top">
                                    <span>设备变动</span>
                                </div>
                                <div class="mach_list_bottom">
                                    <div class="mach_item_bottom">
                                        <div class="machBorder machBorderOrange">
                                            <div class="machBorderRadius"></div>
                                            <div class="wave_box">
                                                <div class="wave1"></div>
                                                <div class="wave2"></div>
                                                <div class="wave3"></div>
                                            </div>
                                        </div>
                                        <div class="num orange numText">{{ machObj.todayNetInNum }}台</div>
                                        <div class="round">
                                            <div class="text">今日入网</div>
                                        </div>
                                    </div>
                                    <div class="mach_item_bottom">
                                        <div class="machBorder machBorderOrange">
                                            <div class="machBorderRadius"></div>
                                            <div class="wave_box">
                                                <div class="wave1"></div>
                                                <div class="wave2"></div>
                                                <div class="wave3"></div>
                                            </div>
                                        </div>
                                        <div class="num orange numText">{{ machObj.todayNetOffNum }}台</div>
                                        <div class="round">
                                            <div class="text">今日离网</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item mach_work_list">
                                <div class="mach_item_top">
                                    <span>日均/累计工时</span>
                                </div>
                                <div class="mach_list_bottom" style="margin-top:0.3rem">
                                    <div class="canvas">
                                        <div id="avgWorkTimes" :style="{ height: '1.62rem', width: '1.62rem', }"></div>
                                        <div id="totalWorkTimes" :style="{ height: '1.62rem', width: '1.62rem', }"></div>
                                    </div>
                                    <div class="info">
                                        <div class="info_list">
                                            <div class="info_item">
                                                <span class="radius" style="background: #D1E8FE"></span>
                                                <span class="name">日均工作时长</span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.avgWorkTimes }}</span>
                                                    <span>H</span>
                                                </span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.avgWorkTimes > 0 ? ( (machObj.avgWorkTimes / machObj.avgWorkTimesCount) * 100 ).toFixed(2) : 0 }}</span>
                                                    <span>%</span>
                                                </span>
                                            </div>
                                            <div class="info_item">
                                                <span class="radius" style="background:linear-gradient(180deg, #ABC0FB 0%, #566AE9 100%)"></span>
                                                <span class="name">日均怠机时长</span>
                                                <span class="sub">
                                                    <span class="blue">{{machObj.avgIdleTimes}}</span>
                                                    <span>H</span>
                                                </span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.avgIdleTimes > 0 ? ( (machObj.avgIdleTimes / machObj.avgWorkTimesCount) * 100 ).toFixed(2) : 0 }}</span>
                                                    <span>%</span>
                                                </span>
                                            </div>
                                        </div>
                                        <div class="info_list">
                                            <div class="info_item">
                                                <span class="radius" style="background: #CED7F8" ></span>
                                                <span class="name" >累计工作时长</span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.totalWorkTimes }}</span>
                                                    <span>H</span>
                                                </span>
                                                <span class="sub">
                                                    <span class="blue">
                                                        {{ machObj.totalWorkTimes > 0 ? ((machObj.totalWorkTimes / machObj.totalWorkTimesCount) * 100).toFixed(2) : 0 }}
                                                    </span>
                                                    <span>%</span>
                                                </span>
                                            </div>
                                            <div class="info_item">
                                                <span class="radius" style="background:linear-gradient(180deg, #28CBD7 0%, #5D90FF 100%);"></span>
                                                <span class="name" >累计怠机时长</span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.totalIdleTimes }}</span>
                                                    <span>H</span>
                                                </span>
                                                <span class="sub">
                                                    <span class="blue">
                                                        {{ machObj.totalIdleTimes > 0 ? ((machObj.totalIdleTimes / machObj.totalWorkTimesCount) * 100).toFixed(2) : 0 }}
                                                    </span>
                                                    <span>%</span>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item mach_oil_list">
                                <div class="mach_item_top">
                                    <span>日均工作效率/油耗</span>
                                </div>
                                <div class="mach_list_bottom">
                                    <div class="canvas" style="width:100%">
                                        <div class="mach_item_bottom">
                                            <div id="avgEfficExp"></div>
                                            <div class="totalNumber"><span>{{ machObj.avgEfficExp }}</span>%</div>
                                            <div class="info_item">
                                                <span class="name">日均工作效率</span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.avgEfficExp }}%</span>
                                                </span>
                                            </div>
                                        </div>
                                        <div class="mach_item_bottom">
                                            <div id="avgOilWear"></div>
                                            <div class="totalNumber"><span>{{ machObj.avgOilWear }}</span>L</div>
                                            <div class="info_item">
                                                <span class="name">日均油耗</span>
                                                <span class="sub">
                                                    <span class="blue">{{ machObj.avgOilWear }}L</span>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-mach')"></div>
                    <div class="line" id="line"></div> -->
                    <!-- 物资日志 -->
                    <!-- <div class="com_box" id="module4" v-if="ModalList.includes('prj/log-fmam')">
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb7.svg" />物资日志</div>
                            <el-button type="text" @click="toDetails('fmam')" >详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item fim_box">
                                <div class="canvas">
                                    <div class="canvas_left">
                                        <img src="../../assets/images/prj/log/log_fim_statistics1_icon.png" />
                                    </div>
                                    <div class="canvas_line"></div>
                                    <div class="canvas_center">
                                        <p>过磅统计</p>
                                        <p>今日过磅次数（次）</p>
                                    </div>
                                    <div class="canvas_right">
                                        {{ fmamObj.weighNoteDayTotal }}
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item fim_box">
                                <div class="canvas">
                                    <div class="canvas_left">
                                        <img src="../../assets/images/prj/log/log_fim_statistics2_icon.png" />
                                    </div>
                                    <div class="canvas_line"></div>
                                    <div class="canvas_center">
                                        <p>收料统计</p>
                                        <p>今日收料（吨）</p>
                                    </div>
                                    <div class="canvas_right">
                                        {{ fmamObj.receiveWeighTotal }}
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item fim_box">
                                <div class="canvas">
                                    <div class="canvas_left">
                                        <img src="../../assets/images/prj/log/log_fim_statistics3_icon.png" />
                                    </div>
                                    <div class="canvas_line" style="background: #6c87aa"></div>
                                    <div class="canvas_center">
                                        <p>过磅统计</p>
                                        <p>今日发料（吨）</p>
                                    </div>
                                    <div class="canvas_right" style="color: #6c87aa">
                                        {{ fmamObj.sendWeighTotal }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-fmam')"></div> -->
                    <!-- 车辆日志 -->
                    <!-- <div class="com_box" style="margin-bottom:0.3rem" id="module5" v-if="ModalList.includes('prj/log-car')">
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb8.svg"/>车辆日志</div>
                            <el-button type="text" @click="toDetails('car')">详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item">
                                <div class="mach_item_top">
                                    <img src="../../assets/images/prj/log/log_car_statistics_icon.png" alt="" class="icon" />
                                    <span>车辆统计</span>
                                </div>
                                <div class="mach_item_bottom">
                                    <div class="flowerPicture">
                                        <div class="picture1"></div>
                                        <div class="num" :style="{textIndent:carObj.carNum>9&&carObj.carNum<20?'-0.22rem':'0'}">{{carObj.carNum}}</div>
                                    </div>
                                    <div class="text">进出场车辆总数(辆)</div>
                                </div>
                            </div>
                            <div class="mach_item car_list">
                                <div class="mach_item_top">
                                    <img src="../../assets/images/prj/log/log_fvs_wraning_icon.png" alt="" class="icon" />
                                    <span>车次排名</span>
                                </div>
                                <div class="mach_item_bottom" style="display: block">
                                    <div class="overflowBox" v-if="carObj.licensePlateList.length > 0">
                                        <div v-show="carObj.licensePlateList.length > 7" :class="['box_left', carIndex == 0 ? 'hiddeClass' : '']" v-preventReClick="1500" @click="carPrevFn">
                                            <img src="../../assets/svg/changeRight.svg"/>
                                        </div>
                                        <div v-show="carObj.licensePlateList.length > 7" :class="['box_right', carIndex == this.carObj.licensePlateList.length - 7 ? 'hiddeClass' : '']" v-preventReClick="1500" @click="carNextFn">
                                            <img src="../../assets/svg/changeLeft.svg"/>
                                        </div>
                                        <div class="boxList">
                                            <div class="env_box" :style="{left: -carIndex * 1.96 + 'rem',}" v-if="carObj.licensePlateList.length > 0">
                                                <div v-for="(item, index) in carObj.licensePlateList" :key="index" class="car_item">
                                                    <div class="car_item_left" :style="[{'background-image': `url(${require(`../../assets/images/prj/log/log_car_ranking${index < 3 ? index + 1 : 4}_icon.png`)})`}]">
                                                        {{ index + 1 }}
                                                    </div>
                                                    <div class="car_item_right">
                                                        <div class="car_item_right_top">{{item.licensePlate}}</div>
                                                        <div class="car_item_right_bottom">
                                                            {{item.num && item.num > 99 ? "99+" : item.num}}次
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="boxSlider">
                                            {{carIndex+1}}/{{carObj.licensePlateList.length-6}}
                                        </div>
                                    </div>
                                    <div class="data_none" v-else>暂无数据</div>
                                </div>
                            </div>
                        </div>
                    </div> -->
                    <!-- 安全日志 -->
                    <div class="com_box" id="module6" v-if="ModalList.includes('prj/log-safety')" >
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb4.svg"/>安全日志</div>
                            <el-button type="text" @click="toDetails('safety')" >详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item quality_statistics_list">
                                <div class="mach_item_top">
                                    <span>检查统计</span>
                                </div>
                                <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class=" quality_item_bottom_box mach_list_bottom">
                                        <div class="canvas" style="width:1.62rem;height: 1.62rem;" >
                                            <div id="safetyStatistics" :style="{height:'100%',width:'100%'}"></div>
                                        </div>
                                        <div class="info infoLeft">
                                            <div class="info_list">
                                                <div class="info_item">
                                                    <span class="radius" style="background: #D1E8FE;"></span>
                                                    <span class="name" style="width: 0.9rem" >问题总数</span>
                                                    <span class="sub" style="width: 0.5rem" >
                                                        <span class="blue">{{ safetyObj.questionNum }}</span>
                                                    </span>
                                                    <span class="sub" style="width: 0.9rem">
                                                        <span class="blue">{{safetyObj.questionNum > 0 ? ((safetyObj.questionNum / safetyObj.allNum) * 100).toFixed(2) : 0}}</span>
                                                        <span>%</span>
                                                    </span>
                                                </div>
                                                <div class="info_item">
                                                    <span class="radius" style="background:linear-gradient(180deg, #ABC0FB 0%, #566AE9 100%);"></span>
                                                    <span class="name" style="width: 0.9rem" >排查总数</span>
                                                    <span class="sub" style="width: 0.5rem">
                                                        <span class="blue">{{safetyObj.checkNum}}</span>
                                                    </span>
                                                    <span class="sub" style="width: 0.9rem">
                                                        <span class="blue">{{safetyObj.checkNum > 0 ? ((safetyObj.checkNum / safetyObj.allNum) * 100).toFixed(2) : 0}}</span>
                                                        <span>%</span>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item quality_statistics_list">
                                <div class="mach_item_top">
                                    <!-- <img src="../../assets/images/prj/log/log_quality_report_statistics_icon.png" alt="" class="icon"/>-->
                                    <span>上报人统计</span>
                                </div>
                                <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class="quality_item_bottom_box mach_list_bottom">
                                        <div class="canvas" style="width:100%">
                                            <div id="safetyReportStatistics" :style="{ height: '1.62rem', width: '1.62rem' }"></div>
                                            <div class="emp_box" id="safetyReportSlide" @mouseover="safetyReportOver" @mouseleave="safetyReportLeave">
                                                <div class="emp_list" id="safetyReportSlide1">
                                                    <div class="emp_item" v-for="(item, index) in safetyReportList" :key="index">
                                                        <div class="p" style="display: flex;align-items: center;justify-content: flex-start;">
                                                            <span class="radius" :style="[{background: colors[index]}]"></span>
                                                            <span class="name">{{item.name}}</span>
                                                            <span class="sub" style="width: 0.5rem;">
                                                                <span class="blue">{{item.value}}</span>
                                                            </span>
                                                            <span class="sub" style="width: 1rem;margin-right: 0;">
                                                                <span class="blue">{{item.value > 0 ? ((item.value / safetyObj.questionNum) * 100).toFixed(2) : 0}}</span>
                                                                <span style="margin-right: 0;">%</span>
                                                            </span>
                                                        </div>
                                                    </div>
                                                    <template v-if="safetyReportList.length > 5">
                                                        <div class="emp_item" v-for="(item, index) in safetyReportList" :key="index + safetyReportList.length">
                                                            <div class="p" style="display: flex;align-items: center;justify-content: flex-start;">
                                                                <span class="radius" :style="[{background: colors[index]}]"></span>
                                                                <span class="name">{{item.name}}</span>
                                                                <span class="sub" style="width: 0.5rem;">
                                                                    <span class="blue">{{item.value}}</span>
                                                                </span>
                                                                <span class="sub" style="width: 1rem;margin-right: 0;">
                                                                    <span class="blue">{{item.value > 0 ? ((item.value / safetyObj.questionNum) * 100).toFixed(2) : 0}}</span>
                                                                    <span style="margin-right: 0;">%</span>
                                                                </span>
                                                            </div>
                                                        </div>
                                                    </template>
                                                </div>
                                                <div class="emp_list" id="safetyReportSlide2" v-if="safetyReportList.length > 5"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item quality_statistics_list" style="width:8rem">
                                <div class="mach_item_top">
                                    <span>问题类别</span>
                                </div>
                                <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class=" quality_item_bottom_box mach_list_bottom">
                                        <div class="canvas" style="width: 100%">
                                            <div id="safetyIssueClass" :style="{height: '1.62rem', width: '1.62rem'}"></div>
                                            <div class="emp_box">
                                                <div class="tableBox" style="width: 100%">
                                                    <div class="tableList" style="width: 100%">
                                                        <el-table ref="tableList" :data="safetyIssueClassCount > 0 ? safetyObj.issueList : []" style="width: 100%" height="1.5rem" :stripe="true">
                                                            <template slot="empty">
                                                                <div class="no_lsit" style="width: 96%;margin: auto;">
                                                                    <img src="../../assets/images/common/rotary_nodata.png" style="width: 100%; height: 100%;" />
                                                                </div>
                                                            </template>
                                                            <el-table-column width="100px" prop="name" label="类别名称">
                                                                <template slot-scope="scope">
                                                                    <Tooltip transfer :content="scope.row.name" placement="top-start" max-width="100">
                                                                        <div class="p" style="width: 90px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;cursor: pointer;">
                                                                            {{scope.row.name}}
                                                                        </div>
                                                                    </Tooltip>
                                                                </template>
                                                            </el-table-column>
                                                            <el-table-column align="center" prop="value" label="问题个数"></el-table-column>
                                                            <el-table-column align="center" prop="value" label="占比">
                                                                <template slot-scope="scope">
                                                                    {{scope.row.value > 0 ? ((scope.row.value / safetyIssueClassCount) * 100).toFixed(2) : 0}}%
                                                                </template>
                                                            </el-table-column>
                                                        </el-table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-safety')"></div>
                    <!-- 质量日志 -->
                    <div class="com_box" id="module7" v-if="ModalList.includes('prj/log-quality')" >
                        <div class="top">
                            <div class="title"><img src="../../assets/svg/sb3.svg"/>质量日志</div>
                            <el-button type="text" @click="toDetails('quality')" >详情<span class="el-icon-d-arrow-right"></span></el-button>
                        </div>
                        <div class="bottom">
                            <div class="mach_item quality_statistics_list">
                                <div class="mach_item_top">
                                    <!-- <img src="../../assets/images/prj/log/log_quality_statistics_icon.png" class="icon" /> -->
                                    <span>检查统计</span>
                                </div>
                                <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class="quality_item_bottom_box mach_list_bottom" >
                                        <div class="canvas" style="width:1.62rem;height: 1.62rem;" >
                                            <div id="qualityStatistics" :style="{height: '100%',width:' 100%',}" ></div>
                                        </div>
                                        <div class="info infoLeft">
                                            <div class="info_list">
                                                <div class="info_item">
                                                    <span class="radius" style="background: #D1E8FE;" ></span>
                                                    <span class="name" style="width: 0.9rem" >问题总数</span>
                                                    <span class="sub" style="width: 0.5rem">
                                                        <span class="blue">{{ qualityObj.questionNum }}</span>
                                                    </span>
                                                    <span class="sub" style="width: 0.9rem" >
                                                        <span class="blue">
                                                            {{ qualityObj.questionNum > 0 ? ((qualityObj.questionNum / qualityObj.allNum) * 100).toFixed(2) : 0 }}
                                                        </span>
                                                        <span>%</span>
                                                    </span>
                                                </div>
                                                <div class="info_item">
                                                    <span class="radius" style="background:linear-gradient(180deg, #ABC0FB 0%, #566AE9 100%);" ></span>
                                                    <span class="name" style="width: 0.9rem" >排查总数</span>
                                                    <span class="sub" style="width: 0.5rem" >
                                                        <span class="blue">{{ qualityObj.checkNum }}</span>
                                                    </span>
                                                    <span class="sub" style="width: 0.9rem" >
                                                        <span class="blue">
                                                            {{ qualityObj.checkNum > 0 ? ((qualityObj.checkNum / qualityObj.allNum) * 100).toFixed(2) : 0 }}
                                                        </span>
                                                        <span>%</span>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item quality_statistics_list">
                                <div class="mach_item_top">
                                    <!-- <img src="../../assets/images/prj/log/log_quality_report_statistics_icon.png" class="icon" /> -->
                                    <span>上报人统计</span>
                                    <div class="switch_btn">
                                        <div :class="['item', qualitySwitchActive == 1 ? 'active' : '']" @click="qualitySwitchFn(1)" >排查</div>
                                        <div :class="['item', qualitySwitchActive == 2 ? 'active' : '']" @click="qualitySwitchFn(2)" >问题</div>
                                    </div>
                                </div>
                                <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class=" quality_item_bottom_box mach_list_bottom">
                                        <div class="canvas" style=" width:100%">
                                            <div id="qualityReportStatistics" :style="{height: '1.62rem',width: '1.62rem'}"></div>
                                            <div class="emp_box" id="qualityReportSlide" @mouseover="qualityReportOver" @mouseleave="qualityReportLeave">
                                                <div class="emp_list" id="qualityReportSlide1" >
                                                    <div class="emp_item" v-for="(item, index) in qualityReportList" :key="index" >
                                                        <div class="p" style="display: flex;align-items: center;justify-content: flex-start;" >
                                                            <span class="radius" :style="[{ background: colors[index]}]"></span>
                                                            <span class="name" >{{ item.name }}</span>
                                                            <span class="sub" style="width: 0.5rem;" >
                                                                <span class="blue">{{ item.value }}</span>
                                                            </span>
                                                            <span class="sub" style="width: 1rem;margin-right: 0;" >
                                                                <span class="blue" v-if="qualitySwitchActive == 1" >
                                                                    {{ item.value > 0 ? ((item.value / qualityObj.checkNum) * 100).toFixed(2) : 0 }}
                                                                </span>
                                                                <span class="blue" v-if="qualitySwitchActive == 2" >
                                                                    {{ item.value > 0 ? ((item.value / qualityObj.questionNum) * 100).toFixed(2) : 0 }}
                                                                </span>
                                                                <span style="margin-right: 0;">%</span>
                                                            </span>
                                                        </div>
                                                    </div>
                                                    <template v-if="qualityReportList.length > 5" >
                                                        <div class="emp_item" v-for="(item, index) in qualityReportList" :key="index + qualityReportList.length" >
                                                            <div class="p" style="display: flex;align-items: center;justify-content: flex-start;" >
                                                                <span class="radius" :style="[{background:colors[index]}]" ></span>
                                                                <span class="name" >{{ item.name }}</span>
                                                                <span class="sub" style="width: 0.5rem;" >
                                                                    <span class="blue">{{ item.value }}</span>
                                                                </span>
                                                                <span class="sub" style="width: 1rem;margin-right: 0;">
                                                                    <span class="blue" v-if="qualitySwitchActive == 1">
                                                                        {{ item.value > 0 ? ((item.value / qualityObj.checkNum) * 100).toFixed(2) : 0 }}
                                                                    </span>
                                                                    <span class="blue" v-if="qualitySwitchActive == 2">
                                                                        {{ item.value > 0 ? ((item.value / qualityObj.questionNum) * 100).toFixed(2) : 0 }}
                                                                    </span>
                                                                    <span style="margin-right: 0;">%</span>
                                                                </span>
                                                            </div>
                                                        </div>
                                                    </template>
                                                </div>
                                                <div class="emp_list" id="qualityReportSlide2" v-if="qualityReportList.length > 5" ></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="mach_item quality_statistics_list" style="width:8rem">
                                <div class="mach_item_top">
                                    <!-- <img src="../../assets/images/prj/log/log_quality_issue_class_icon.png" class="icon" /> -->
                                    <span>问题类别</span>
                                </div>
                                <div class="quality_item_bottom" style="margin-top:0.2rem">
                                    <div class="quality_item_bottom_box mach_list_bottom">
                                        <div class="canvas" style="width: 100%" >
                                            <div id="qualityIssueClass" :style="{height: '1.65rem', width: '1.65rem'}"></div>
                                            <div class="emp_box">
                                                <div class="tableBox" style="width: 100%" >
                                                    <div class="tableList" style="width: 100%" >
                                                        <el-table  ref="tableList" :data="qualityIssueClassCount > 0 ? qualityObj.issueList : []" style="width: 100%" height="1.5rem" :stripe="true">
                                                            <template slot="empty" >
                                                                <div class="no_lsit" style="width: 96%;margin: auto;">
                                                                    <img src="../../assets/images/common/rotary_nodata.png" style="width: 100%;height: 100%;" />
                                                                </div>
                                                            </template>
                                                            <el-table-column prop="name" label="类别名称" width="100px" >
                                                                <template slot-scope="scope" >
                                                                    <Tooltip transfer :content="scope.row.name" placement="top-start" max-width="100" >
                                                                        <div class="p" style="width: 90px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;cursor: pointer;" >
                                                                            {{ scope.row.name }}
                                                                        </div>
                                                                    </Tooltip>
                                                                </template>
                                                            </el-table-column>
                                                            <el-table-column align="center" prop="value" label="问题个数"></el-table-column>
                                                            <el-table-column align="center" prop="value" label="占比">
                                                                <template slot-scope="scope" >
                                                                    {{ scope.row.value > 0 ? (( scope.row.value / qualityIssueClassCount) * 100).toFixed(2) : 0 }}%
                                                                </template>
                                                            </el-table-column>
                                                        </el-table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="line" v-if="ModalList.includes('prj/log-quality')" ></div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import {
    getMachDayLog_V1,
    getEmpDayLog_V1,
    getQualityDayLog_V1,
    getSafetyDayLog_V1,
    getEnvDayLog_V1,
    getFvsDayLog_V1,
    getFimResultStatic,
    getFmamDayLog_V1,
    getCarDayLog_V1,
} from "@/api/log";
export default {
    data() {
        return {
            colors: [
                "#A9A0F3 ",
                "#28D79C ",
                "#A9B0BB ",
                "#8BB5FE ",
                "#5D90FF ",
                "#FFBFB5 ",
                "#FF4848",
                "#FFD52E",
                "#C7D3F5",
            ],
            colors2: [
                "#5D90FF",
                "#FCC23B",
                "#C7D3F5",
                "#A9A0F3 ",
                "#28D79C ",
                "#A9B0BB ",
                "#8BB5FE ",
                "#FFBFB5 ",
                "#FF4848",
                "#FFD52E",
            ],
            tabActiveName: 0, //tab切换
            deptId: "", //项目id
            options: {
                //时间选择器规则
                disabledDate(date) {
                    return date > Date.now() - 86400000;
                },
            },
            moduleList: [
                //模块tab列表
                {
                    name: "人员管理",
                    id: 0,
                    code: "prj/log-emp",
                    flag: false,
                },
                {
                    name: "视频监控",
                    id: 1,
                    code: "prj/log-fvs",
                    flag: false,
                },
                {
                    name: "环境监测",
                    id: 2,
                    code: "prj/log-env",
                    flag: false,
                },
                /* {
                    name: "设备管理",
                    id:3,
                    code: "prj/log-mach",
                    flag: false,
                },
                {
                    name: "物资管理",
                    id:4,
                    code: "prj/log-fmam",
                    flag: false,
                },
                {
                    name: "车辆管理",
                    id:5,
                    code: "prj/log-car",
                    flag: false,
                }, */
                {
                    name: "安全管理",
                    id:6,
                    code: "prj/log-safety",
                    flag: false,
                },
                {
                    name: "质量管理",
                    id:7,
                    code: "prj/log-quality",
                    flag: false,
                },
            ],
            inputShow: false, //解决浏览器填充问题
            dataFlag: true, //模块flag
            timeFlag: true, //最大日期flag
            day: this.$moment().subtract(1, "days").format("YYYY-MM-DD"), //当天日期
            maxDate: this.$moment().subtract(1, "days").format("YYYY-MM-DD"), //最大日期
            machObj: {
                //设备统计对象
                avgWorkTimes: 0, //日均工作时长
                avgIdleTimes: 0, //日均怠机时长
                totalWorkTimes: 0, //累计工作时长
                totalIdleTimes: 0, //累计怠机时长
                avgOilWear: 0, //日均油耗（L）
                avgEfficExp: 0, //日均工作效率
                totalMachNum: 0, //设备总数
                todayNetInNum: 0, //今日入网
                todayNetOffNum: 0, //今日离网
            },
            empObj: {
                //人员统计对象
                empTotal: 0, //在职人员
                attendManagerNum: 0, //管理人员出勤人数
                attendWorkerNum: 0, //工人出勤人数
                attendWorkerRate: 0, //工人出勤率
                attendManagerRate: 0, //管理出勤人数
                enterList: [], //进场列表
                outerList: [], //出场列表
            },
            progressWidth: 100, //进度圆的宽度
            enterFlag: null, //进场列表滚动flag
            outerFlag: null, //出场列表滚动flag
            qualityObj: {
                //质量统计对象
                allNum: 0, //质量检查总数
                questionNum: 0, //质量问题数量
                checkNum: 0, //质量检查数量
                checkList: [], //质量检查列表
                questionList: [], //质量问题列表
                issueList: [], //质量问题类别列表
            },
            qualitySwitchActive: 1, //质量问题or检查上报切换标记
            qualityReportList: [], //质量问题or检查上报数据列表
            qualityReportFlag: null, //质量问题or检查上报列表滚动flag
            qualityReportCount: 0, //质量问题or检查上报总数
            qualityIssueClassCount: 0, //问质量题类别总数

            safetyObj: {
                //安全统计对象
                allNum: 0, //安全检查总数
                questionNum: 0, //安全问题数量
                checkNum: 0, //安全检查数量
                checkList: [], //安全检查列表
                questionList: [], //安全问题列表
                issueList: [], //安全问题类别列表
            },
            safetyReportList: [], //安全问题or检查上报数据列表
            safetyReportFlag: null, //安全问题or检查上报列表滚动flag
            safetyReportCount: 0, //安全问题or检查上报总数
            safetyIssueClassCount: 0, //安全问题类别总数

            envObj: {
                //环境统计对象
                deviceTypeCountList:[], //设备
            },
            resEnvList: [], //环境渲染列表
            envList: [
                //环境数据列表
                {
                    name: "PM2.5",
                    min: 0,
                    max: 0,
                },
                {
                    name: "PM10",
                    min: 0,
                    max: 0,
                },
                {
                    name: "噪声",
                    min: 0,
                    max: 0,
                },
                {
                    name: "温度",
                    min: 0,
                    max: 0,
                },
                {
                    name: "湿度",
                    min: 0,
                    max: 0,
                },
                {
                    name: "风力",
                    min: 0,
                    max: 0,
                },
                {
                    name: "风速",
                    min: 0,
                    max: 0,
                },
                {
                    name: "TSP",
                    min: 0,
                    max: 0,
                },
                {
                    name: "气压",
                    min: 0,
                    max: 0,
                },
                {
                    name: "水质",
                    min: 0,
                    max: 0,
                },

                {
                    name: "一氧化碳 CO",
                    min: 0,
                    max: 0,
                },
                {
                    name: "二氧化碳 CO₂",
                    min: 0,
                    max: 0,
                },
                {
                    name: "硫化氢 H₂S",
                    min: 0,
                    max: 0,
                },
                {
                    name: "甲烷 CH₄",
                    min: 0,
                    max: 0,
                },
                {
                    name: "氧气 O₂",
                    min: 0,
                    max: 0,
                },
            ],
            envIndex: 0, //环境切换下标

            fvsObj: {
                //视频监控统计对象
                deviceNum: 0, //设备总数
                captureNum: 0, //抓拍总数
            },
            fimWarningList: [], //视频监控报警统计
            fimWarningCunt: 0, //视频监控总数报警统计
            fimIndex: 0, //视频报警切换下标

            fmamObj: {
                //物资日志数据对象
                weighNoteDayTotal: 0, //今日过磅次数
                receiveWeighTotal: 0, //今日收料总重
                sendWeighTotal: 0, //今日发料总重
            },
            carObj: {
                //车辆日志数据对象
                carNum: 0, //总数
                licensePlateList: [], //车牌统计
            },
            carIndex: 0, //视频报警切换下标
            ModalList: [],
        };
    },
    computed: {
        porjectObject() {
            return this.$store.state.porjectObject;
        },
    },
    watch: {
        porjectObject(val, oldVal) {
            if (val.deptId != oldVal.deptId) {
                this.deptId = val.deptId;
                this.initData();
            }
        },
    },
    methods: {
        // 初始化请求数据
        initData() {
            if (this.enterFlag) {
                clearInterval(this.enterFlag); // 在Vue实例销毁前，清除我们的定时器
            }
            this.enterFlag = null;
            if (this.outerFlag) {
                clearInterval(this.outerFlag); // 在Vue实例销毁前，清除我们的定时器
            }
            this.outerFlag = null;
            if (this.qualityReportFlag) {
                clearInterval(this.qualityReportFlag); // 在Vue实例销毁前，清除我们的定时器
            }
            this.qualityReportFlag = null;

            this.moduleList.forEach(element => {
                if(element.code==="prj/log-mach"&&element.flag===true){
                    this.getMachDayLogFn()
                    return
                }
                if(element.code==="prj/log-emp"&&element.flag===true){
                    this.getEmpDayLogFn()
                    return
                }
                if(element.code==="prj/log-quality"&&element.flag===true){
                    this.getQualityDayLogFn();
                    return
                }
                if(element.code==="prj/log-safety"&&element.flag===true){
                    this.getSafetyDayLogFn();
                    return
                }
                if(element.code==="prj/log-env"&&element.flag===true){
                    this.getEnvDayLogFn()
                    return
                }
                if(element.code==="prj/log-fvs"&&element.flag===true){
                    this.getFvsDayLogFn()
                    this.getFimResultStaticFn()
                    return
                }
                if(element.code==="prj/log-fmam"&&element.flag===true){
                    this.getFmamDayLogFn()
                    return
                }
                if(element.code==="prj/log-car"&&element.flag===true){
                    this.getCarDayLogFn()
                    return
                }
            });
        },
        // 锚点链接
        getModuleFn(type) {
            // 获取点击的按钮对应页面的id
            let moduleObj = document.querySelector("#module" + type);
            // let line = document.querySelector("#line");
            // 打印出对应页面与窗口的距离
            // let scrollHeight = type * (line.offsetHeight + moduleObj.offsetHeight);
            let scrollHeight = type * moduleObj.offsetHeight;
            if(type==4){
                scrollHeight += 350
            }
            document.querySelector("#boxScroll").scrollTo({ behavior: "smooth", top: scrollHeight });
        },
        toDetails(code) {
            let obj = null;
            this.$store.state.ruleList.forEach((v) => {
                if (v.code == code) {
                    obj = v;
                }
            });
            if (obj.children && obj.children.length > 0) {
                this.$store.commit("setModalPage", obj.children);
                obj.children.forEach((item) => {
                    if (item.code == "mach/report-center") {
                        localStorage.setItem("pathId", item.id);
                        for (
                            let i = 0;
                            i < this.$store.state.ruleList.length;
                            i++
                        ) {
                            if (
                                this.$store.state.ruleList[i].children &&
                                this.$store.state.ruleList[i].children.length >
                                    0
                            ) {
                                for (
                                    let j = 0;
                                    j <
                                    this.$store.state.ruleList[i].children
                                        .length;
                                    j++
                                ) {
                                    if (
                                        this.$store.state.ruleList[i].children[
                                            j
                                        ].url == item.url
                                    ) {
                                        this.$store.commit(
                                            "setModalPage",
                                            this.$store.state.ruleList[i]
                                                .children
                                        );
                                        this.$router.push({
                                            path: "./../mach/report-center",
                                        });
                                    }
                                }
                            }
                        }
                    } else if (item.code == "env/dust") {
                        localStorage.setItem("pathId", item.id);
                        for (
                            let i = 0;
                            i < this.$store.state.ruleList.length;
                            i++
                        ) {
                            if (
                                this.$store.state.ruleList[i].children &&
                                this.$store.state.ruleList[i].children.length >
                                    0
                            ) {
                                for (
                                    let j = 0;
                                    j <
                                    this.$store.state.ruleList[i].children
                                        .length;
                                    j++
                                ) {
                                    if (
                                        this.$store.state.ruleList[i].children[
                                            j
                                        ].url == item.url
                                    ) {
                                        this.$store.commit(
                                            "setModalPage",
                                            this.$store.state.ruleList[i]
                                                .children
                                        );
                                        this.$router.push({
                                            path: "/env/dust/data",
                                        });
                                    }
                                }
                            }
                        }
                    } else if (
                        item.code == "emp/attendCenter" ||
                        item.code == "fmam/ana"
                    ) {
                        if (item.children && item.children.length > 0) {
                            for (let i = 0; i < item.children.length; i++) {
                                if (item.children[i].url == "/emp/attend") {
                                    localStorage.setItem("pathId", item.id);
                                    this.$router.push({
                                        path: item.children[i].url,
                                    });
                                    localStorage.setItem(
                                        "pathChildId",
                                        item.children[i].id
                                    );
                                    this.$store.commit(
                                        "setModalChildPage",
                                        item.children
                                    );
                                } else if (
                                    item.children[i].url == "/fmam/receiveNote"
                                ) {
                                    localStorage.setItem("pathId", item.id);
                                    this.$router.push({
                                        path: item.children[i].url,
                                    });
                                    localStorage.setItem(
                                        "pathChildId",
                                        item.children[i].id
                                    );
                                    this.$store.commit(
                                        "setModalChildPage",
                                        item.children
                                    );
                                }
                            }
                        }
                    } else if (
                        item.code == "quality/record" ||
                        item.code == "safety/record" ||
                        item.code == "ana/history" ||
                        item.code == "car/gate"
                    ) {
                        localStorage.setItem("pathId", item.id);
                        this.$router.push({ path: item.url });
                    } else if (item.code == "fvs/fim") {
                        if (item.children && item.children.length > 0) {
                            for (let i = 0; i < item.children.length; i++) {
                                if (
                                    item.children[i].url == "/fvs/warn/record"
                                ) {
                                    localStorage.setItem("pathId", item.id);
                                    this.$router.push({
                                        path: item.children[i].url,
                                    });
                                    localStorage.setItem(
                                        "pathChildId",
                                        item.children[1].id
                                    );
                                    this.$store.commit(
                                        "setModalChildPage",
                                        item.children
                                    );
                                }
                            }
                        }
                    }
                });
            }
            localStorage.setItem("logTime", JSON.stringify(this.day));
        },
        // 时间接收函数
        getData(index) {
            debugger
            this.day = index;
            if (
                this.$moment(this.maxDate).format("YYYY-MM-DD") ==
                this.$moment(this.day).format("YYYY-MM-DD")
            ) {
                this.timeFlag = true;
            } else {
                this.timeFlag = false;
            }
            this.initData();
        },
        // 前一天函数
        prevFn() {
            this.timeFlag = false;
            this.day = this.$moment(this.day).subtract(1, "days").format("YYYY-MM-DD");
            this.initData();
        },
        // 后一天函数
        nextFn() {
            this.timeFlag = false;
            this.day = this.$moment(this.day)
                .add(1, "days")
                .format("YYYY-MM-DD");
            this.initData();
            if (
                this.$moment(this.maxDate).format("YYYY-MM-DD") ==
                this.$moment(this.day).format("YYYY-MM-DD")
            ) {
                this.timeFlag = true;
            }
        },
        // 获取设备日志
        getMachDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getMachDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.machObj = res.data || {};
                        this.machObj.avgWorkTimesCount =
                            this.machObj.avgWorkTimes +
                            this.machObj.avgIdleTimes;
                        this.machObj.totalWorkTimesCount =
                            this.machObj.totalWorkTimes +
                            this.machObj.totalIdleTimes;
                        this.avgWorkTimesFn();
                        this.totalWorkTimesFn();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 日均数据分析 echarts图表
        avgWorkTimesFn() {
            let avgWorkTimes = this.$echarts.init(
                document.getElementById("avgWorkTimes")
            );
            let that = this
            avgWorkTimes.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                    formatter:function(params){
                        return params.marker+'日均工作时长: '+(that.machObj.avgWorkTimesCount*params.value/100).toFixed(2)+'H'
                    }
                },
                title: {
                    text: that.machObj.avgWorkTimesCount.toFixed(2),
                    left: "center",
                    top: "50%",
                    textStyle: {
                        color: "#333333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "30%",
                    style: {
                        text: "日均开机时长",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize:16,
                        fontWeight: 400,
                    },
                },
                angleAxis: {
                    polarIndex: 0,
                    min: 0,
                    max: 100,
                    show: false,
                },
                radiusAxis: {
                    type: 'category',
                    show: true,
                    axisLabel: {
                        show: false,
                    },
                    axisLine: {
                        show: false,

                    },
                    axisTick: {
                        show: false
                    },
                },
                polar: [{
                    center: ['50%', '50%'], //中心点位置
                    radius: ['100%', '84%'], //图形大小
                }],
                series: [
                    {
                        type: 'bar',
                        z: 10,
                        name: "日均工作时长",
                        data: [(that.machObj.avgWorkTimes/that.machObj.avgWorkTimesCount*100).toFixed(2)],
                        showBackground: false,
                        backgroundStyle: {
                            borderWidth: 10,
                            width: 10
                        },
                        coordinateSystem: 'polar',
                        roundCap: true,
                        barWidth: 35, //大的占比环
                        itemStyle: {
                            normal: {
                                color:new that.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                    offset: 0,
                                    color: '#566AE9'
                                }, {
                                    offset: 1,
                                    color: '#ABC0FB'
                                }]),
                            }
                        },
                    },
                    {
                        type: 'pie',
                        name: '内层细圆环',
                        radius: ['100%', '84%'],
                        center: ['50%', '50%'], //中心点位置
                        startAngle: 90,
                        hoverAnimation: false,
                        clockWise: true,
                        silent: true,
                        itemStyle: {
                            normal: {
                                color: '#D1E8FE',
                                shadowBlur: 0,
                                shadowColor: '#66666a',
                            }
                        },
                        tooltip: {
                            show: false,
                        },
                        label: {
                            show: false
                        },
                        data: [100]
                    },
                ],
            });
        },
        // 累计数据分析 echarts图表
        totalWorkTimesFn() {
            let totalWorkTimes = this.$echarts.init(
                document.getElementById("totalWorkTimes")
            );
            let that = this
            totalWorkTimes.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                    // extraCssText: "box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);",
                    formatter:function(params){
                        return params.marker+'累计工作时长: '+(that.machObj.totalWorkTimesCount*params.value/100).toFixed(2)+'H'
                    }
                },
                title: {
                    text: this.machObj.totalWorkTimesCount.toFixed(2),
                    left: "center",
                    top: "50%",
                    textStyle: {
                        color: "#333333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "30%",
                    style: {
                        text: "累计开机时长",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize:14,
                        fontWeight: 400,
                    },
                },
                angleAxis: {
                    polarIndex: 0,
                    min: 0,
                    max: 100,
                    show: false,
                },
                radiusAxis: {
                    type: 'category',
                    show: true,
                    axisLabel: {
                        show: false,
                    },
                    axisLine: {
                        show: false,

                    },
                    axisTick: {
                        show: false
                    },
                },
                polar: [{
                    center: ['50%', '50%'], //中心点位置
                    radius: ['100%', '84%'], //图形大小
                }],
                series: [
                    {
                        type: 'bar',
                        z: 10,
                        name: "累计工作时长",
                        data: [(that.machObj.totalWorkTimes/that.machObj.totalWorkTimesCount*100).toFixed(2)],
                        showBackground: false,
                        backgroundStyle: {
                            borderWidth: 10,
                            width: 10
                        },
                        coordinateSystem: 'polar',
                        roundCap: true,
                        barWidth: 35, //大的占比环
                        itemStyle: {
                            normal: {
                                color:new that.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                    offset: 0,
                                    color: '#5D90FF'
                                }, {
                                    offset: 1,
                                    color: '#28CBD7'
                                }]),
                            }
                        },
                    },
                    {
                        type: 'pie',
                        name: '内层细圆环',
                        radius: ['100%', '84%'],
                        center: ['50%', '50%'], //中心点位置
                        startAngle: 90,
                        hoverAnimation: false,
                        clockWise: true,
                        silent: true,
                        itemStyle: {
                            normal: {
                                color: '#CED7F8',
                                shadowBlur: 0,
                                shadowColor: '#66666a',
                            }
                        },
                        tooltip: {
                            show: false,
                        },
                        label: {
                            show: false
                        },
                        data: [100]
                    },
                ],
            });
        },
        // 获取人员日志
        getEmpDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getEmpDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.empObj = res.data || {};
                        this.empObj.managerNum = res.data.managerNum || 0;
                        this.empObj.workerNum = res.data.workerNum || 0;
                        this.empObj.attendManagerRate =
                            this.empObj.attendManagerNum === 0
                                ? 0
                                : Number(
                                      (
                                          (this.empObj.attendManagerNum /
                                              this.empObj.managerNum) *
                                          100
                                      ).toFixed(2)
                                  );
                        this.empObj.attendWorkerRate =
                            this.empObj.attendWorkerNum === 0
                                ? 0
                                : Number(
                                      (
                                          (this.empObj.attendWorkerNum /
                                              this.empObj.workerNum) *
                                          100
                                      ).toFixed(2)
                                  );
                        if (this.empObj.enterList.length > 5) {
                            this.enterFlag = setInterval(this.enterScroll, 100);
                        }
                        if (this.empObj.outerList.length > 5) {
                            this.outerFlag = setInterval(this.outerScroll, 100);
                        }
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 进场滚动函数
        enterScroll() {
            let enterSlide = document.getElementById("enterSlide");
            let enterSlide2 = document.getElementById("enterSlide2");
            let enterSlide1 = document.getElementById("enterSlide1");
            enterSlide2.innerHTML = enterSlide1.innerHTML;
            if (enterSlide2.offsetTop - enterSlide.scrollTop <= 0)
                enterSlide.scrollTop -= enterSlide1.offsetHeight;
            else {
                enterSlide.scrollTop++;
            }
        },
        // 进场鼠标移入
        enterOver() {
            clearInterval(this.enterFlag);
        },
        // 进场鼠标移出
        enterLeave() {
            if (this.empObj.enterList.length > 5) {
                this.enterFlag = setInterval(this.enterScroll, 100);
            }
        },
        // 出场滚动函数
        outerScroll() {
            let outerSlide = document.getElementById("outerSlide");
            let outerSlide2 = document.getElementById("outerSlide2");
            let outerSlide1 = document.getElementById("outerSlide1");
            outerSlide2.innerHTML = outerSlide1.innerHTML;
            if (outerSlide2.offsetTop - outerSlide.scrollTop <= 0)
                outerSlide.scrollTop -= outerSlide1.offsetHeight;
            else {
                outerSlide.scrollTop++;
            }
        },
        // 出场鼠标移入
        outerOver() {
            clearInterval(this.enterFlag);
        },
        // 出场鼠标移出
        outerLeave() {
            if (this.empObj.enterList.length > 5) {
                this.enterFlag = setInterval(this.enterScroll, 100);
            }
        },

        // 获取质量日志
        getQualityDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getQualityDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.qualityObj = res.data || {};
                        // 问题or检查 数据处理
                        let qualityReportList = [];
                        this.qualityReportList = [];
                        let qualityReportCount = 0;
                        if (this.qualitySwitchActive == 1) {
                            qualityReportList = this.qualityObj.checkList;
                        } else if (this.qualitySwitchActive == 2) {
                            qualityReportList = this.qualityObj.questionList;
                        }
                        qualityReportList.forEach((v, i) => {
                            qualityReportCount += v.num;
                            let obj = {
                                name: v.userName,
                                value: v.num,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[i],
                                    },
                                    emphasis: {
                                        color: this.colors[i],
                                    },
                                },
                            };
                            this.qualityReportList.push(obj);
                        });
                        if (this.qualityReportList.length > 5) {
                            this.qualityReportFlag = setInterval(
                                this.qualityReportScroll,
                                100
                            );
                        }
                        if (this.qualityReportList.length == 0) {
                            let obj = {
                                name: "暂无数据",
                                value: 0,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[0],
                                    },
                                    emphasis: {
                                        color: this.colors[0],
                                    },
                                },
                            };
                            this.qualityReportList.push(obj);
                        }
                        this.qualityReportCount = qualityReportCount;

                        // 问题类别处理
                        let issueList = this.qualityObj.issueList;
                        let issueArr = [];
                        let qualityIssueClassCount = 0;
                        issueList.forEach((v, i) => {
                            qualityIssueClassCount += v.num;
                            let obj = {
                                name: v.issueName,
                                value: v.num,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[i],
                                    },
                                    emphasis: {
                                        color: this.colors[i],
                                    },
                                },
                            };
                            issueArr.push(obj);
                        });
                        this.qualityObj.issueList = issueArr;
                        this.qualityIssueClassCount = qualityIssueClassCount;
                        if (this.qualityObj.issueList.length == 0) {
                            let obj = {
                                name: "暂无数据",
                                value: 0,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[0],
                                    },
                                    emphasis: {
                                        color: this.colors[0],
                                    },
                                },
                            };
                            this.qualityObj.issueList.push(obj);
                        }
                        this.qualityStatisticsFn();
                        this.qualityReportStatisticsFn();
                        this.qualityIssueClassFn();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 问题or检查上报切换
        qualitySwitchFn(type) {
            if (this.qualityReportFlag) {
                clearInterval(this.qualityReportFlag);
            }
            this.qualitySwitchActive = type;
            this.qualityReportList = [];
            let qualityReportList = [];
            this.qualityReportList = [];
            let qualityReportCount = 0;
            if (this.qualitySwitchActive == 1) {
                qualityReportList = this.qualityObj.checkList;
            } else if (this.qualitySwitchActive == 2) {
                qualityReportList = this.qualityObj.questionList;
            }
            qualityReportList.forEach((v, i) => {
                qualityReportCount += v.num;
                let obj = {
                    name: v.userName,
                    value: v.num,
                    itemStyle: {
                        normal: {
                            color: this.colors[i],
                        },
                        emphasis: {
                            color: this.colors[i],
                        },
                    },
                };
                this.qualityReportList.push(obj);
            });
            this.qualityReportCount = qualityReportCount;
            if (this.qualityReportList.length == 0) {
                let obj = {
                    name: "暂无数据",
                    value: 0,
                    itemStyle: {
                        normal: {
                            color: this.colors[0],
                        },
                        emphasis: {
                            color: this.colors[0],
                        },
                    },
                };
                this.qualityReportList.push(obj);
            }

            this.qualityReportFlag = null;
            if (this.qualityReportList.length > 5) {
                this.qualityReportFlag = setInterval(
                    this.qualityReportScroll,
                    100
                );
            }
            this.qualityReportStatisticsFn();
        },
        // 检查统计 echarts图表
        qualityStatisticsFn() {
            let qualityStatistics = this.$echarts.init(
                document.getElementById("qualityStatistics")
            );
            let that=this
            qualityStatistics.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                },
                title: {
                    text: that.qualityObj.allNum,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize:20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "35%",
                    style: {
                        text: "排查总数",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize:16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name: "排查总数",
                        type: "pie",
                        radius: ["84%", "100%"],
                        hoverAnimation: false,
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data: [
                            {
                                name: "排查总数",
                                value: that.qualityObj.checkNum,
                                itemStyle: {
                                    normal: {
                                        color:new that.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                            offset: 0,
                                            color: '#566AE9'
                                        }, {
                                            offset: 1,
                                            color: '#ABC0FB'
                                        }]),
                                    },
                                },
                            },
                            {
                                name: "问题总数",
                                value: that.qualityObj.questionNum,
                                itemStyle: {
                                    normal: {
                                        color: "#D1E8FE",
                                    },
                                    emphasis: {
                                        color: '#D1E8FE',
                                    },
                                },
                            },
                        ],
                    },
                ],
            });
        },
        // 问题or检查上报 echarts图表
        qualityReportStatisticsFn() {
            let qualityReportStatistics = this.$echarts.init(
                document.getElementById("qualityReportStatistics")
            );
            qualityReportStatistics.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                },
                title: {
                    text: this.qualityReportCount,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "40%",
                    style: {
                        text:
                            this.qualitySwitchActive == 1
                                ? "排查总数"
                                : "问题总数",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize: 16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name:
                            this.qualitySwitchActive == 1
                                ? "排查总数"
                                : "问题总数",
                        type: "pie",
                        radius: ["84%", "100%"],
                        hoverAnimation: false,
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data: this.qualityReportList,
                    },
                ],
            });
        },
        // 问题类别 echarts图表
        qualityIssueClassFn() {
            let qualityIssueClass = this.$echarts.init(
                document.getElementById("qualityIssueClass")
            );
            qualityIssueClass.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                },
                title: {
                    text: this.qualityIssueClassCount,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "40%",
                    style: {
                        text: "问题类别",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize: 16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name: "问题类别",
                        type: "pie",
                        radius: ["84%", "100%"],
                        hoverAnimation: false,
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data: this.qualityObj.issueList,
                    },
                ],
            });
        },
        // 问题or检查上报滚动函数
        qualityReportScroll() {
            let qualityReportSlide =
                document.getElementById("qualityReportSlide");
            let qualityReportSlide2 = document.getElementById(
                "qualityReportSlide2"
            );
            let qualityReportSlide1 = document.getElementById(
                "qualityReportSlide1"
            );
            qualityReportSlide2.innerHTML = qualityReportSlide1.innerHTML;
            if (
                qualityReportSlide2.offsetTop - qualityReportSlide.scrollTop <=
                0
            )
                qualityReportSlide.scrollTop -=
                    qualityReportSlide1.offsetHeight;
            else {
                qualityReportSlide.scrollTop++;
            }
        },
        // 问题or检查上报鼠标移入
        qualityReportOver() {
            clearInterval(this.qualityReportFlag);
        },
        // 问题or检查上报鼠标移出
        qualityReportLeave() {
            if (this.qualityReportList.length > 5) {
                this.qualityReportFlag = setInterval(
                    this.qualityReportScroll,
                    100
                );
            }
        },

        // 获取安全日志
        getSafetyDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getSafetyDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.safetyObj = res.data || {};
                        // 问题or检查 数据处理
                        let safetyReportList = this.safetyObj.questionList;
                        this.safetyReportList = [];
                        let safetyReportCount = 0;
                        safetyReportList.forEach((v, i) => {
                            safetyReportCount += v.num;
                            let obj = {
                                name: v.userName,
                                value: v.num,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[i],
                                    },
                                },
                            };
                            this.safetyReportList.push(obj);
                        });
                        if (this.safetyReportList.length > 5) {
                            this.safetyReportFlag = setInterval(
                                this.qualityReportScroll,
                                100
                            );
                        }
                        if (this.safetyReportList.length == 0) {
                            let obj = {
                                name: "暂无数据",
                                value: 0,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[0],
                                    },
                                },
                            };
                            this.safetyReportList.push(obj);
                        }
                        this.safetyReportCount = safetyReportCount;

                        // 问题类别处理
                        let issueList = this.safetyObj.issueList;
                        let issueArr = [];
                        let safetyIssueClassCount = 0;
                        issueList.forEach((v, i) => {
                            safetyIssueClassCount += v.num;
                            let obj = {
                                name: v.issueName,
                                value: v.num,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[i],
                                    },
                                },
                            };
                            issueArr.push(obj);
                        });
                        this.safetyObj.issueList = issueArr;
                        this.safetyIssueClassCount = safetyIssueClassCount;
                        if (this.safetyObj.issueList.length == 0) {
                            let obj = {
                                name: "暂无数据",
                                value: 0,
                                itemStyle: {
                                    normal: {
                                        color: this.colors[0],
                                    },
                                },
                            };
                            this.safetyObj.issueList.push(obj);
                        }
                        this.safetyStatisticsFn();
                        this.safetyReportStatisticsFn();
                        this.safetyIssueClassFn();
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 检查统计 echarts图表
        safetyStatisticsFn() {
            let safetyStatistics = this.$echarts.init(
                document.getElementById("safetyStatistics")
            );
            let that=this
            safetyStatistics.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                    // extraCssText: "box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);",
                    // formatter:'{b}:{c}',
                },
                title: {
                    text: that.safetyObj.allNum,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize:20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "35%",
                    style: {
                        text: "检查总数  ",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize:16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name: "检查总数",
                        type: "pie",
                        radius: ["84%", "100%"],
                        hoverAnimation: false,
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data: [
                            {
                                name: "问题总数",
                                value: that.safetyObj.questionNum,
                                itemStyle: {
                                    normal: {
                                        color:new that.$echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                            offset: 0,
                                            color: '#566AE9'
                                        }, {
                                            offset: 1,
                                            color: '#ABC0FB'
                                        }]),
                                    },
                                },
                            },
                            {
                                name: "排查总数",
                                value: that.safetyObj.checkNum,
                                itemStyle: {
                                    normal: {
                                        color: "#D1E8FE",
                                    },
                                    emphasis: {
                                        color: '#D1E8FE',
                                    },
                                },
                            },
                        ],
                    },
                ],
            });
        },
        // 问题or检查上报 echarts图表
        safetyReportStatisticsFn() {
            let safetyReportStatistics = this.$echarts.init(
                document.getElementById("safetyReportStatistics")
            );
            safetyReportStatistics.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                    // extraCssText: "box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);",
                    // formatter:'{b}:{c}',
                },
                title: {
                    text: this.safetyReportCount,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "35%",
                    style: {
                        text: "问题总数",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize: 16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name: "问题总数",
                        type: "pie",
                        radius: ["84%", "100%"],
                        hoverAnimation: false,
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data: this.safetyReportList,
                    },
                ],
            });
        },
        // 问题类别 echarts图表
        safetyIssueClassFn() {
            let safetyIssueClass = this.$echarts.init(
                document.getElementById("safetyIssueClass")
            );
            safetyIssueClass.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    textStyle: {
                        color: "#303030",
                    },
                },
                title: {
                    text: this.safetyIssueClassCount,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "35%",
                    style: {
                        text: "问题类别",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize: 16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name: "问题类别",
                        type: "pie",
                        radius: ["84%", "100%"],
                        hoverAnimation: false,
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data: this.safetyObj.issueList,
                    },
                ],
            });
        },
        // 问题or检查上报滚动函数
        safetyReportScroll() {
            let safetyReportSlide =
                document.getElementById("safetyReportSlide");
            let safetyReportSlide2 =
                document.getElementById("safetyReportSlide2");
            let safetyReportSlide1 =
                document.getElementById("safetyReportSlide1");
            safetyReportSlide2.innerHTML = safetyReportSlide1.innerHTML;
            if (safetyReportSlide2.offsetTop - safetyReportSlide.scrollTop <= 0)
                safetyReportSlide.scrollTop -= safetyReportSlide1.offsetHeight;
            else {
                safetyReportSlide.scrollTop++;
            }
        },
        // 问题or检查上报鼠标移入
        safetyReportOver() {
            clearInterval(this.safetyReportFlag);
        },
        // 问题or检查上报鼠标移出
        safetyReportLeave() {
            if (this.qualityReportList.length > 5) {
                this.qualityReportFlag = setInterval(
                    this.safetyReportScroll,
                    100
                );
            }
        },

        // 获取环境日志
        getEnvDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getEnvDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.envObj = res.data || {};
                        this.$nextTick(()=>{
                            this.environmentClass()
                        })
                        this.envList[1].max = this.envObj.pm10Max;
                        this.envList[1].min = this.envObj.pm10Min;

                        this.envList[0].max = this.envObj.pm25Max;
                        this.envList[0].min = this.envObj.pm25Min;

                        this.envList[2].max = this.envObj.noiseMax;
                        this.envList[2].min = this.envObj.noiseMin;

                        this.envList[3].max = this.envObj.envTempMax;
                        this.envList[3].min = this.envObj.envTempMin;

                        this.envList[4].max = this.envObj.envRhMax;
                        this.envList[4].min = this.envObj.envRhMin;

                        this.envList[5].max = this.envObj.windLevelMax;
                        this.envList[5].min = this.envObj.windLevelMin;

                        this.envList[6].max = this.envObj.windSpeedMax;
                        this.envList[6].min = this.envObj.windSpeedMin;

                        this.envList[7].max = this.envObj.tspMax;
                        this.envList[7].min = this.envObj.tspMin;

                        this.envList[8].max = this.envObj.atmosMax;
                        this.envList[8].min = this.envObj.atmosMin;

                        this.envList[9].max = this.envObj.ssMax;
                        this.envList[9].min = this.envObj.ssMin;

                        this.envList[10].max = this.envObj.coMax;
                        this.envList[10].min = this.envObj.coMin;

                        this.envList[11].max = this.envObj.co2Max;
                        this.envList[11].min = this.envObj.co2Min;

                        this.envList[12].max = this.envObj.h2sMax;
                        this.envList[12].min = this.envObj.h2sMin;

                        this.envList[13].max = this.envObj.ch4Max;
                        this.envList[13].min = this.envObj.ch4Min;

                        this.envList[14].max = this.envObj.o2Max;
                        this.envList[14].min = this.envObj.o2Min;
                        let envList = [];
                        for (const key in this.envList) {
                            if (
                                this.envList[key].max != undefined ||
                                this.envList[key].min != undefined
                            ) {
                                envList.push(this.envList[key]);
                            }
                        }
                        this.resEnvList = envList;
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 设备统计
        environmentClass() {
            let safetyIssueClass = this.$echarts.init(
                document.getElementById("environmentName")
            );
            let list=[]
            if(this.envObj.deviceTypeCountList.length>0){
                this.envObj.deviceTypeCountList.forEach((item,i)=>{
                    list.push({
                            name: item.deviceName,
                            value: item.count,
                            itemStyle: {
                                normal: {
                                    color: this.colors2[i],
                                },
                            },
                        })
                })
            }else{
                list=[{
                    name: '暂无数据',
                    value: 0,
                    itemStyle: {
                        normal: {
                            color: this.colors2[0],
                        },
                    },
                }]
            }
            safetyIssueClass.setOption({
                tooltip: {
                    // formatter: this.machTypeStatTipfn,
                    //触发类型：坐标轴触发
                    trigger: "item",
                    backgroundColor: "rgba(255,255,255,0.8)", //通过设置rgba调节背景颜色与透明度
                    color: "black",
                    // position:'right',
                    textStyle: {
                        color: "#303030",
                    },
                },
                title: {
                    text: this.envObj.allNum,
                    left: "center",
                    top: "55%",
                    textStyle: {
                        color: "#333",
                        fontSize: 20,
                        align: "center",
                    },
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "35%",
                    style: {
                        text: "设备总数",
                        textAlign: "center",
                        fill: "#A9B0BB",
                        fontSize: 16,
                        fontWeight: 400,
                    },
                },
                series: [
                    {
                        name: "设备类别",
                        type: "pie",
                        radius: ["66%", "88%"],
                        labelLine: {
                            show: false,
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false,
                            },
                        },
                        data:list,
                    },
                ],
            });
        },
        // 环境前进按钮
        envPrevFn() {
            if (this.envIndex != 0) {
                this.envIndex -= 1;
            }
        },
        // 环境后退按钮
        envNextFn() {
            if (this.envIndex != this.resEnvList.length - 4) {
                this.envIndex += 1;
            }
        },

        // 获取视频日志
        getFvsDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getFvsDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.fvsObj = res.data || {};
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 获取视频统计
        getFimResultStaticFn() {
            let params = {
                deptId: this.deptId,
                startTime: this.$moment(this.day).format("YYYY-MM-DD 00:00:00"),
                endTime: this.$moment(this.day).format("YYYY-MM-DD 23:59:59"),
            };
            getFimResultStatic(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.fimWarningList = res.data.list || [];
                        let fimWarningCunt = 0;
                        this.fimWarningList.forEach((v) => {
                            fimWarningCunt += v.count;
                        });
                        this.fimWarningCunt = fimWarningCunt;
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 视频前进按钮
        fimPrevFn() {
            if (this.fimIndex != 0) {
                this.fimIndex -= 1;
            }
        },
        // 视频后退按钮
        fimNextFn() {
            if (this.fimIndex != this.fimWarningList.length - 5 && this.fimWarningList.length >4) {
                this.fimIndex += 1;
            }
        },

        // 获取物资日志
        getFmamDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getFmamDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.fmamObj = res.data || {};
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },
        // 获取车辆日志
        getCarDayLogFn() {
            let params = {
                deptId: this.deptId,
                date: this.$moment(this.day).format("YYYY-MM-DD"),
            };
            getCarDayLog_V1(params)
                .then((res) => {
                    if (res.code == 200) {
                        this.carObj = res.data || {};
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch((error) => {
                    console.log(error);
                });
        },

        // 车辆前进按钮
        carPrevFn() {
            if (this.carIndex != 0) {
                this.carIndex -= 1;
            }
        },
        // 车辆后退按钮
        carNextFn() {
            if (this.carIndex != this.carObj.licensePlateList.length - 7) {
                this.carIndex += 1;
            }
        },
        getCode() {
            let arr = JSON.parse(localStorage.getItem("arr"))

            for (let i = 0; i < arr.length; i++) {
                this.ModalList.push(arr[i]);
            }

            for (let i = 0; i < this.moduleList.length; i++) {

                if (this.ModalList.includes(this.moduleList[i].code)) {
                    this.moduleList[i].flag = true
                }
            }

            // for (let i = 0; i < this.moduleList.length; i++) {

            //     if (!this.ModalList.includes(this.moduleList[i].code)) {
            //         this.moduleList.splice(i, 1);
            //     }
            // }
            // for (let i = 0; i < this.ModalList.length; i++) {
            //     for (let j = 0; j < this.moduleList.length; j++) {
            //         if (this.moduleList[j].code == this.ModalList[i]) {
            //             this.moduleList[j].flag = true;
            //         }
            //     }
            // }
        },
        // 油耗
        oilStatistics(){
            let setCahrt1 = this.$echarts.init(
                document.getElementById("avgEfficExp")
            );
            let setCahrt2 = this.$echarts.init(
                document.getElementById("avgOilWear")
            );
            let options={
                series: [
                    {
                    type: 'gauge',
                    center: ['50%', '70%'],
                    radius: "100%",
                    startAngle: 200,
                    endAngle: -20,
                    min: 0,
                    max: 60,
                    splitNumber: 12,
                    itemStyle: {
                        color: '#4267E2'
                    },
                    progress: {
                        show: true,
                        width:10
                    },
                    pointer: {
                        show: false
                    },
                    axisLine: {
                        lineStyle: {
                        width:10
                        }
                    },
                    axisTick: {
                        distance:-16,
                        length:1,
                        splitNumber:5,
                        lineStyle: {
                        width:1,
                        color: '#999'
                        }
                    },
                    splitLine: {
                        distance: -20,
                        length:4,
                        lineStyle: {
                        width:1,
                        color: '#999'
                        }
                    },
                    axisLabel: {
                        distance:-2,
                        color: '#999',
                        fontSize:6
                    },
                    anchor: {
                        show: false
                    },
                    title: {
                        show: false
                    },
                    detail: {
                        valueAnimation: true,
                        fontSize: 0,
                    },
                    data: [
                        {
                        show: false,
                        value: 20,
                        fontSize:0
                        }
                    ]
                    },
                    {
                    type: 'gauge',
                    center: ['50%', '70%'],
                    radius: "100%",
                    startAngle: 200,
                    endAngle: -20,
                    min: 0,
                    max: 60,
                    itemStyle: {
                        color: '#5D90FF'
                    },
                    progress: {
                        show: true,
                        width:2
                    },
                    pointer: {
                        show: false
                    },
                    axisLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: false
                    },
                    detail: {
                        show: false
                    },
                    data: [
                        {
                            value: 20,
                            fontSize:0
                        }
                    ]
                    }
                ]
            }
            setCahrt1.setOption(options);
            setCahrt2.setOption(options);
        },
        // 入/离职
        postStatistics(){
            let setCahrt1 = this.$echarts.init(
                document.getElementById("personnelChart1")
            );
            let setCahrt2 = this.$echarts.init(
                document.getElementById("personnelChart2")
            );
            let color1 = ['#1891FF', '#FCC23B', '#9A8BFE'];
            let color2= ['#1891FF', '#28D79C', '#9A8BFE'];
            let chartData = [{
                    name: "1",
                    value:60,
                },
                {
                    name: "2",
                    value:50,
                },
                {
                    name: "3",
                    value:40,
                },
            ];
            let arrName = [];
            let arrValue = [];
            let sum = 100;
            let pieSeries = [],
                lineYAxis = [];

            // 数据处理
            chartData.forEach((v, i) => {
                arrName.push(v.name);
                arrValue.push(v.value);
            })

            // 图表option整理
            chartData.forEach((v, i) => {
                pieSeries.push({
                    name: '',
                    type: 'pie',
                    clockWise: false,
                    hoverAnimation: false,
                    radius: [100 - i * 15 + '%',92 - i * 15 + '%'],
                    center: ["50%", "50%"],
                    label: {
                        show: false
                    },
                    data: [{
                        value: v.value,
                        name: v.name
                    }, {
                        value: sum - v.value,
                        name: '',
                        itemStyle: {
                            color: "rgba(0,0,0,0)"
                        }
                    }]
                });
                pieSeries.push({
                    name: '',
                    type: 'pie',
                    silent: true,
                    z: 1,
                    clockWise: false, //顺时加载
                    hoverAnimation: false, //鼠标移入变大
                    radius: [100 - i * 15 + '%',92 - i * 15 + '%'],
                    center: ["50%", "50%"],
                    label: {
                        show: false
                    },
                    data: [{
                        value: 7.5,
                        itemStyle: {
                            color: "#E5E7EA",
                        }
                    }, {
                        value: 2.5,
                        name: '',
                        itemStyle: {
                            color: "rgba(0,0,0,0)"
                        }
                    }]
                });
            })
            let options1={
                color: color1,
                grid: {
                    top: '15%',
                    bottom: '62%',
                    left: "30%",
                    containLabel: false
                },
                yAxis: [{
                    type: 'category',
                    inverse: true,
                    axisLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false
                    },
                    data: lineYAxis
                }],
                xAxis: [{
                    show: false
                }],
                series: pieSeries
            }
            let options2={
                color: color2,
                grid: {
                    top: '15%',
                    bottom: '62%',
                    left: "30%",
                    containLabel: false
                },
                yAxis: [{
                    type: 'category',
                    inverse: true,
                    axisLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        show: false
                    },
                    data: lineYAxis
                }],
                xAxis: [{
                    show: false
                }],
                series: pieSeries
            }
            setCahrt1.setOption(options1);
            setCahrt2.setOption(options2);
        }
    },

    beforeDestroy() {
        if (this.enterFlag) {
            clearInterval(this.enterFlag); // 在Vue实例销毁前，清除我们的定时器
        }
        if (this.outerFlag) {
            clearInterval(this.outerFlag); // 在Vue实例销毁前，清除我们的定时器
        }
        if (this.qualityReportFlag) {
            clearInterval(this.qualityReportFlag); // 在Vue实例销毁前，清除我们的定时器
        }
        if (this.safetyReportFlag) {
            clearInterval(this.safetyReportFlag); // 在Vue实例销毁前，清除我们的定时器
        }
    },
    mounted() {
        this.deptId = this.$store.state.porjectObject.deptId;
        this.getCode();
        this.initData();
        this.$nextTick(() => {
            //在下次 DOM 更新循环结束之后执行这个回调。在修改数据之后立即使用这个方法，获取更新后的DOM.
            if(this.ModalList.includes('prj/log-emp')){
                this.progressWidth = this.$refs.round.clientHeight;
                this.postStatistics()
            }
            if(this.ModalList.includes('prj/log-mach')){
                this.oilStatistics()
            }


        });
        setTimeout(() => {
            this.inputShow = true;
        }, 1);
    },
};
</script>
<style lang="less" scoped>
@import "./../../assets/style/themeBase.less";
</style>

<style lang="scss" scoped>
@function pxToRem($val) {
    @return $val/100 + rem;
}
/deep/.log {
    width: 100%;
    height: 100%;
    background: #fff;
    display: flex;
    justify-content: space-between;
    .content {
        width: calc(100% - 40px);
        height: 100%;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin-top: 20px;
        .headerBox {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding:11px 40px;
            background-color: #fff;
            border-radius: pxToRem(6);
            box-sizing: border-box;
            margin-bottom: 20px;
            box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.1600);
            .tabs {
                width: 70%;
                .ivu-tabs {
                    width: 100%;
                    color: #999999;
                }
                .ivu-tabs-bar {
                    padding: 0;
                    box-sizing: border-box;
                    border-bottom: none;
                    margin: 0;
                    .ivu-tabs-nav-scroll,
                    .ivu-tabs-nav-wrap,
                    .ivu-tabs-nav-container,
                    .ivu-tabs {
                        overflow: visible !important;
                    }

                    .ivu-tabs-ink-bar {
                        bottom: pxToRem(-5);
                        // background-color: #1891ff;
                        z-index: 99;
                    }
                    .ivu-tabs-tab {
                        box-sizing: border-box;
                        &:hover {
                            color: #333333;
                        }
                        &.ivu-tabs-tab-active {
                            color: #333333;
                        }
                    }
                }
            }
            .time {
                .timeBox {
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;
                    color: var(--themeColor);
                    border: 1px solid var(--themeColor);
                    width: 200px;
                    height: 30px;
                    background: #ffffff;
                    border-radius: 2px;
                    z-index: 1;
                    .arrow_left,
                    .arrow_right {
                        width: 30px;
                        height: 30px;
                        text-align: center;
                        line-height: 30px;
                        font-size: 24px;
                        cursor: pointer;
                    }
                    .arrow_left:hover,
                    .arrow_right:hover {
                        background-color: var(--themeColor);
                        color: #fff;
                    }
                    .time_center {
                        flex: 1;
                        height: 30px;
                        border-left: 1px solid var(--themeColor);
                        border-right: 1px solid var(--themeColor);
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        flex-direction: column;
                        .ivu-input {
                            border: none;
                            border-right-color: none;
                            width: 100%;
                            height: 100%;
                            text-align: center;
                            padding: 0;
                            color: var(--themeColor);
                            cursor: pointer;
                            &:active {
                                outline: none;
                            }
                            &:focus {
                                border-color: none;
                                box-shadow: none;
                            }
                        }
                        .ivu-select-dropdown {
                            top: 150px !important;
                        }
                        .ivu-select-dropdown {
                            color: #515a6e;
                        }

                        .ivu-icon.ivu-icon-ios-calendar-outline {
                            display: none;
                        }
                    }
                }
            }
        }
        .line {
            width: 100%;
        }
        .box {
            flex: 1;
            width: 100%;
            overflow-y: scroll;
            &::-webkit-scrollbar {
                width: 0;
            }
            /*滚动槽*/
            &::-webkit-scrollbar-track {
                -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
                border-radius: 10px;
            }
            /* 滚动条滑块 */
            &::-webkit-scrollbar-thumb {
                border-radius: 10px;
                background: rgba(0, 0, 0, 0.1);
                -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
                box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
            }
            &::-webkit-scrollbar-thumb:window-inactive {
                background: rgba(255, 0, 0, 0.4);
            }
            .com_box {
                .top {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    width: 100%;
                    height: pxToRem(60);
                    padding: 0 pxToRem(20);
                    box-sizing: border-box;
                    background: #fff;
                    border-top-left-radius: pxToRem(4);
                    border-top-right-radius: pxToRem(4);
                    font-size: pxToRem(20);
                    font-family: Source Han Sans CN;
                    font-weight: 400;
                    color: #333;
                    .title{
                        display: flex;
                        align-content: center;
                        img{
                            height: pxToRem(20);
                            margin-right: pxToRem(6);
                            margin-top: pxToRem(6);
                        }
                    }
                    .el-button--text{
                        color: var(--themeColor);
                    }
                }
                .bottom {
                    display: flex;
                    // justify-content: flex-start;
                    justify-content: space-between;
                    align-items: center;
                    padding: 0 4px;
                    padding-bottom: pxToRem(10);
                    /deep/.el-button{
                        font-size: pxToRem(16);
                    }
                    .mach_item {
                        position: relative;
                        width: pxToRem(258);
                        height: pxToRem(286);
                        background-color: #fff;
                        box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.1600);
                        border-radius: 6px 6px 6px 6px;
                        // margin-right: pxToRem(20);
                        &:last-of-type {
                            margin-right: 0;
                        }
                        &.mach_list {
                            width: pxToRem(387);
                        }
                        &.mach_work_list {
                            width: pxToRem(667);
                        }
                        &.mach_oil_list {
                            width: pxToRem(510);
                        }
                        .mach_item_top {
                            position: relative;
                            width: 100%;
                            height: pxToRem(56);
                            display: flex;
                            justify-content: flex-start;
                            align-items: center;
                            font-size: pxToRem(16);
                            font-family: Source Han Sans CN;
                            font-weight: 400;
                            color: #333333;
                            margin: auto;
                            // border-bottom: pxToRem(1) solid #ecedee;
                            padding: 0 pxToRem(20);
                            box-sizing: border-box;
                            .icon {
                                width: pxToRem(15);
                                height: pxToRem(15);
                                margin-right: pxToRem(6);
                            }
                            .switch_btn {
                                position: absolute;
                                right: 5%;
                                top: pxToRem(5);
                                width: pxToRem(135);
                                display: flex;
                                justify-content: flex-start;
                                align-items: center;
                                height: pxToRem(25);
                                background: #fff;
                                border-radius: pxToRem(3);
                                border: pxToRem(1) solid #49a9ee;
                                margin: auto;
                                .item {
                                    width: 50%;
                                    height: pxToRem(25);
                                    line-height: pxToRem(25);
                                    text-align: center;
                                    color: #49a9ee;
                                    border-right: pxToRem(1) solid #49a9ee;
                                    cursor: pointer;
                                    font-size: pxToRem(14);
                                    font-family: SourceHanSansCN-Regular;
                                    font-weight: 400;
                                    &.active {
                                        color: #fff;
                                        background-color: #49a9ee;
                                    }
                                    &:last-of-type {
                                        border-right: none;
                                    }
                                }
                            }
                        }
                        .mach_list_bottom {
                            width: 100%;
                            display: flex;
                            justify-content: space-between;
                            align-items: center;
                            .canvas {
                                width: pxToRem(400);
                                height: 100%;
                                display: flex;
                                justify-content:center;
                                align-items: center;
                                #avgWorkTimes{
                                    margin-right:pxToRem(20) ;
                                }
                                #avgOilWear,
                                #avgEfficExp {
                                    width: 100%;
                                    height: pxToRem(162);
                                    margin-bottom: pxToRem(20);
                                }
                                .totalNumber{
                                    font-size: pxToRem(23);
                                    font-weight: 400;
                                    color: #4267E2;
                                    position: absolute;
                                    top: 40%;
                                    left: 50%;
                                    transform: translateX(-50%);
                                    span{
                                        font-size: pxToRem(34);
                                    }
                                }
                                .progress_text {
                                    position: absolute;
                                    top: pxToRem(45);
                                    left: 50%;
                                    transform: translateX(-50%);
                                    font-size: pxToRem(16);
                                    font-family: Source Han Sans CN;
                                    font-weight: 400;
                                    color: #A9B0BB;
                                }
                                .el-progress__text {
                                    font-size: 20px !important;
                                    font-family: Arial;
                                    font-weight: bold;
                                    color: #333333;
                                    top: 65%;
                                }
                            }
                            .info {
                                flex: 1;
                                &.infoLeft{
                                    padding-left: pxToRem(40);
                                }
                                .info_list {
                                    width: 100%;
                                    margin-bottom: pxToRem(20);
                                    .info_item {
                                        width: 100%;
                                        display: flex;
                                        justify-content: flex-start;
                                        align-items: center;
                                        font-size: pxToRem(16);
                                        font-family: Microsoft YaHei;
                                        color: #181818;
                                        margin-bottom: pxToRem(10);
                                        white-space: nowrap;
                                    }
                                }
                            }
                        }
                        .mach_item_bottom {
                            position: relative;
                            width: 100%;
                            display: flex;
                            // justify-content: center;
                            align-items: center;
                            flex-direction: column;
                            &.machRing{
                                height: pxToRem(162);
                            }
                            .info_item {
                                font-size: pxToRem(16);
                            }
                            .num{
                                &.numText{
                                    font-size: pxToRem(27);
                                    font-weight: 400;
                                    color: #005DAB;
                                    position: absolute;
                                    top: pxToRem(30);
                                    left: 50%;
                                    transform: translateX(-50%);
                                }

                                &.orange{
                                color: #B94F78;
                                }
                            }
                            .name {
                                margin-right: pxToRem(10);
                                width: pxToRem(80);
                                overflow: hidden;
                                text-overflow: ellipsis;
                                white-space: nowrap;
                                color: #333;
                                .ivu-tooltip {
                                    width: pxToRem(80);
                                }
                            }
                        }
                        .machBorder{
                            border:1px solid rgba(0, 93, 171, 0.16);
                            padding: pxToRem(14);
                            border-radius:50%;
                            position: relative;
                            &::before{
                                width:pxToRem(4);
                                height:pxToRem(4);
                                background: linear-gradient(180deg, #6BC9FF 0%, #4992E4 56%, #2E66CE 100%);
                                content: '';
                                position: absolute;
                                top:pxToRem(-3);
                                left:50%;
                                border-radius: 50%;
                                z-index: 10;
                            }
                            &.machBorderOrange{
                                border:1px solid rgba(255, 72, 72, 0.16);
                                &::before{
                                    background: linear-gradient(180deg, #FBAB4E 0%, #EE722F 100%);
                                }
                                .machBorderRadius{
                                    &::before{
                                        background: linear-gradient(180deg, #FBAB4E 0%, #EE722F 100%);
                                    }
                                }
                                // 圆球波动
                                .wave_box {
                                    background:radial-gradient(rgba(255, 255, 255, 0.3) 0%,rgba(255, 122, 46, 0.3) 100%);
                                }
                                .wave1 {
                                    background: #B94F78;
                                }
                                .wave2 {
                                    background:radial-gradient(rgba(255, 215, 0, 0.6) 0%,rgba(250, 135, 117, 0.6) 92%);
                                }
                                .wave3{
                                    background:rgba(255, 177, 78, 0.87);
                                }
                            }
                        }
                        .machBorderRadius{
                            position: absolute;
                            top:pxToRem(-2);
                            right:pxToRem(-2);
                            width:pxToRem(78);
                            height:pxToRem(157);
                            overflow: hidden;
                            &::before{
                                width:pxToRem(157);
                                height:pxToRem(157);
                                content: '';
                                position: absolute;
                                top: 0;
                                right: 0;
                                background: linear-gradient(180deg, #6BC9FF 0%, #4992E4 56%, #2E66CE 100%);
                                border-radius: 50%;
                            }
                            &::after{
                                width:pxToRem(153);
                                height:pxToRem(153);
                                content: '';
                                position: absolute;
                                top: pxToRem(2);
                                right: pxToRem(2);
                                background:#fff;
                                border-radius: 50%;
                            }
                        }
                        .progressList {
                            position: absolute;
                            bottom: pxToRem(20);
                            width:pxToRem(400);
                            display: flex;
                            justify-content: flex-start;
                            align-items: center;
                            .progress_item {
                                flex:1;
                                display: flex;
                                align-items: center;
                                justify-content:center;
                                font-size: pxToRem(16);
                            }
                        }
                        &.emp_attend_list {
                            width: pxToRem(703);
                        }
                        &.emp_change_list {
                            width: pxToRem(870);
                            .emp_change_bottom {
                                display: flex;
                                justify-content: flex-start;
                                align-items: center;
                                width: 90%;
                                margin: auto;
                                .emp_change_bottom_item {
                                    width: 50%;
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    flex-direction: column;
                                }
                                .canvas {
                                    width: 100%;
                                    display: flex;
                                    justify-content: flex-end;
                                    align-items: center;
                                    .emp_canvas {
                                        // width: pxToRem(125);
                                        // height: pxToRem(125);
                                        position: relative;
                                        margin-right: pxToRem(20);
                                        .num{
                                            position: absolute;
                                            top:20%;
                                            left:50%;
                                            transform: translateX(-50%);
                                            text-align: center;
                                            font-size: 10px;
                                            font-weight: 400;
                                            color: #4E5969;
                                            white-space: nowrap;
                                            line-height: 1;
                                            p{
                                                font-size: pxToRem(39);
                                                font-family: 'Auto Digital-Bold, Auto Digital';
                                                font-weight: bold;
                                                color: #1891FF;
                                                margin-bottom: pxToRem(10);
                                            }
                                        }
                                    }
                                }
                            }
                        }
                        &.quality_statistics_list {
                            width: pxToRem(520);
                            .quality_item_bottom {
                                height: pxToRem(160);
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                flex-direction: column;
                                .quality_item_bottom_box {
                                    width:100%;
                                    display: flex;
                                    justify-content:center;
                                    align-items: center;
                                    padding: 0 pxToRem(20);
                                }
                            }
                        }
                        &.env_left{
                            width: pxToRem(500);
                            margin-right: pxToRem(15);
                        }
                        &.env_list {
                            flex: 1;
                        }
                        &.fvs_list {
                            width: pxToRem(1316);
                            .fvs_item {
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                width: pxToRem(190);
                                height: pxToRem(100);
                                background: #fff;
                                border: pxToRem(1) solid #ecedee;
                                border-radius: pxToRem(6);
                                box-sizing: border-box;
                                margin:0 pxToRem(20);
                                text-align: center;
                                cursor: pointer;
                                font-family: Source Han Sans CN;
                                .fvs_item_left {
                                    .icon {
                                        width: pxToRem(42);
                                        height: pxToRem(42);
                                        margin-right: pxToRem(15);
                                    }
                                }
                                .fvs_item_right {
                                    .fvs_item_right_bottom {
                                        text-align: left;
                                    }
                                }
                            }
                        }
                        &.fim_box {
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            flex-direction: column;
                            width: pxToRem(614);
                            height: pxToRem(200);
                            .canvas {
                                position: relative;
                                display: flex;
                                justify-content: flex-start;
                                align-items: center;
                                width: pxToRem(527);
                                height: pxToRem(125);
                                background: #f7f7fa;
                                border-radius: pxToRem(10);
                                .canvas_line {
                                    position: absolute;
                                    left: pxToRem(160);
                                    top: 50%;
                                    transform: translateY(-50%);
                                    width: pxToRem(3);
                                    height: pxToRem(41);
                                    background: #8478b4;
                                }
                                .canvas_left,
                                .canvas_right {
                                    width: pxToRem(178);
                                    height: 100%;
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    flex-direction: column;
                                    font-size: pxToRem(36);
                                    font-family: Arial;
                                    font-weight: 400;
                                    color: #6e5fa9;
                                    img {
                                        width: pxToRem(53);
                                        height: pxToRem(42);
                                    }
                                }
                                .canvas_center {
                                    flex: 1;
                                    p {
                                        &:first-of-type {
                                            font-size: 16px;
                                            font-family: Source Han Sans CN;
                                            font-weight: 500;
                                            color: #333333;
                                        }
                                        &:last-of-type {
                                            font-size: 14px;
                                            font-family: Source Han Sans CN;
                                            font-weight: 500;
                                            color: #999999;
                                        }
                                    }
                                }
                            }
                        }

                        &.car_list {
                            width: pxToRem(1594);

                            .car_item {
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                width: pxToRem(186);
                                height: pxToRem(100);
                                background: #fff;
                                border: pxToRem(1) solid #ecedee;
                                border-radius: pxToRem(6);
                                box-sizing: border-box;
                                margin:0 pxToRem(10);
                                text-align: center;
                                // cursor: pointer;
                                font-family: Source Han Sans CN;
                                .car_item_left {
                                    width: pxToRem(51);
                                    height: pxToRem(61);
                                    line-height: pxToRem(70);
                                    text-align: center;
                                    background-repeat: no-repeat;
                                    background-size: 100% 100%;
                                    margin-right: pxToRem(15);
                                }
                                .car_item_right {
                                    .car_item_right_bottom {
                                        text-align: left;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .scorll {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    @keyframes water-wave {
        0% {
            transform: rotate(0deg);
        }
        100% {
            transform: rotate(360deg);
        }
    }
    // 圆球波动
    .wave_box {
        z-index: 10;
        position: relative;
        // left: 50%;
        // top: 50%;
        // transform: translate(-50%, -50%);
        width: pxToRem(125);
        height: pxToRem(125);
        animation: water-wave linear infinite;
        overflow: hidden;
        border-radius: 50%;
        background:radial-gradient(rgba(255, 255, 255, 0.3) 0%,rgba(24, 145, 255, 0.3) 100%);
    }
    .round {
        position: relative;
        height: pxToRem(40);
        // border: pxToRem(1) solid #329fff;
        overflow: hidden;
        z-index: 99;
        text-align: center;
        margin-top: pxToRem(20);
        .text {
            font-size: pxToRem(16);
            font-family: Source Han Sans CN;
            font-weight: 400;
            color: #333;
            line-height: pxToRem(40);
        }
    }
    .wave1 {
        position: absolute;
        top:50%;
        left: -35%;
        background: #2E66CE;
        // opacity: .7;
        width: pxToRem(200);
        height: pxToRem(240);
        border-radius: 40%;
        animation: inherit;
        animation-duration: 7s;
    }
    .wave2 {
        position: absolute;
        top:60%;
        left: -25%;
        background:radial-gradient(rgba(151, 248, 255, 0.6) 20%,rgba(63, 138, 226, 0.6) 100%);
        // background: rgba(50, 159, 255, 0.3);
        // opacity: .7;
        width: pxToRem(250);
        height: pxToRem(250);
        border-radius: 35%;
        animation: inherit;
        animation-duration: 7s;
    }
    .wave3{
        position: absolute;
        top:80%;
        left: -40%;
        background:rgba(71, 114, 194, 0.87);
        // opacity: .3;
        width:pxToRem(250);
        height: pxToRem(250);
        border-radius: 33%;
        animation: inherit;
        animation-duration: 11s;
    }

    .radius {
        width: pxToRem(12);
        height: pxToRem(12);
        border-radius: pxToRem(10);
        background: #98d87d;
        margin-right: pxToRem(10);
    }
    .sub {
        margin-left:pxToRem(12);
        color: #999;
        // span {
        //     &:first-of-type {
        //         font-weight: bold;
        //     }
        // }
        &:last-of-type {
            margin-right: 0;
        }
    }
    // 滚动盒子
    .emp_box {
        padding-left: pxToRem(40);
        position: relative;
        flex: 1;
        height: pxToRem(162);
        overflow: hidden;
        .emp_list {
            position: relative;
            width: 100%;
            height: auto;
            overflow-y: scroll;
            cursor: pointer;
            &::-webkit-scrollbar {
                width: 8px;
            }
            font-size: pxToRem(14);
            font-family: Source Han Sans CN;
            font-weight: 400;
            color: #333333;
            .p {
                width: 100%;
                display: flex;
                justify-content: flex-start;
                align-items: center;
                margin-bottom: pxToRem(10);
                span {
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    margin-right: pxToRem(10);
                }
            }
        }
    }

    // 表格样式
    .tableList {
        width: 100%;
        margin: auto;
        .el-table {
            color: #333;
            font-family: MicrosoftYaHei;
            font-size: pxToRem(16);
            td,
            th.is-leaf {
                border-bottom: none;
            }
            tr {
                border: none;
            }
            thead th .cell{
                background-color: #DEE9FF !important;
                color: #4E5969;
                font-weight: 400;
            }
            td,
            th {
                padding: 0;
            }
            tbody tr:nth-child(2n) .cell{
                background-color: #F0F4F6 !important;
            }
            .cell {
                height: pxToRem(26);
                line-height: pxToRem(26);
                margin-bottom: pxToRem(10);
            }
        }
        .el-table__row {
            background-color: #fff;
            cursor: pointer;
        }
        .el-table--striped .el-table__body tr.el-table__row--striped td {
            background-color: #f6f6f6;
            cursor: pointer;
        }
    }

    // 列表切换
    .overflowBox {
        width: 100%;
        position: relative;
        padding-top: pxToRem(50);
        padding-left: pxToRem(80);
        padding-right: pxToRem(80);
        padding-bottom: pxToRem(30);
        box-sizing: border-box;
        margin: auto;
        .box_left,
        .box_right {
            position: absolute;
            width: pxToRem(30);
            height: pxToRem(58);
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            img{
                width: pxToRem(30);
                height: pxToRem(58);
            }
        }
        .box_left {
            left: pxToRem(30);
        }
        .hiddeClass {
            cursor: not-allowed;
            // background-color: #f5f5f5;
            // color: #fff;
        }
        .box_right {
            right:pxToRem(30);
        }
        .boxSlider{
            position: absolute;
            bottom: 0;
            left: 50%;
            transform:translateX(-50%);
            display: flex;
            div{
                width: pxToRem(64);
                height: pxToRem(6);
                background: #DEE9FF;
                margin: 0 pxToRem(11);
                transform: rotate(10deg) skew(-10deg, -10deg);
                &.active{
                    width: pxToRem(178);
                    background: #1891FF;
                }
            }
        }
        .boxList {
            position: relative;
            width: 100%;
            height: pxToRem(110);
            display: flex;
            justify-content: space-between;
            align-items: center;
            box-sizing: border-box;
            margin: auto;
            box-sizing: border-box;
            overflow: hidden;
            .env_box {
                position: absolute;
                top: 0;
                left: pxToRem(-30);
                width: auto;
                margin: auto;
                display: flex;
                justify-content: flex-start;
                align-items: center;
                transition: all 0.5s ease-in;
                .env_item {
                    width: pxToRem(300);
                    height: pxToRem(160);
                    border-radius: pxToRem(6);
                    box-sizing: border-box;
                    padding:0 pxToRem(30);
                    text-align: center;
                    cursor: pointer;
                    .env_item_top {
                        height: pxToRem(26);
                        line-height: pxToRem(26);
                        background: #DEE9FF;
                        border-radius: 6px 6px 0px 0px;
                        font-family: 'FZZhengHeiS-DB-GB-Regular, FZZhengHeiS-DB-GB';
                        font-weight: 400;
                        color: #2669FC;
                        font-size: pxToRem(20);
                        text-align: center;
                        margin-bottom: pxToRem(38);
                    }
                    .env_item_bottom {
                        font-size: pxToRem(16);
                        font-family: Arial;
                        // font-weight: bold;
                        color: #333333;
                        margin-bottom: pxToRem(25);
                        p {
                            display: flex;
                            justify-content: space-between;
                            align-items: center;
                            padding: 0 pxToRem(10);
                            line-height: 26px;
                            margin-bottom: pxToRem(8);
                            &:nth-child(1){
                                background: #F0F4F6;
                            }
                        }
                    }
                }
            }
        }
    }
    .data_none {
        display: block;
        width: 100%;
        height: 100%;
        text-align: center;
        line-height: pxToRem(165);
    }
}
.personnelChart{
    width: pxToRem(158);
    height: pxToRem(158);
}
.blue{
    color: #1891FF !important;
}
/deep/.el-table thead th{
    background-color: #fff !important;
}
.flowerPicture{
    width: pxToRem(182);
    height: pxToRem(182);
    position: relative;
    .picture1{
         width: pxToRem(182);
        height: pxToRem(182);
        background: url(../../assets/svg/f1.svg) no-repeat center center;
        background-size:pxToRem(182) pxToRem(182);
        animation:fadenum 6s infinite linear;
        &.picture2{
            background: url(../../assets/svg/f2.svg) no-repeat center center;
            background-size:pxToRem(182) pxToRem(182);
        }
    }
    .num{
        width: pxToRem(182);
        height:pxToRem(98);
        position: absolute;
        top: 50%;
        left:0;
        transform: translateY(-50%);
        font-size: pxToRem(78);
        font-family: 'Auto Digital-Bold, Auto Digital';
        font-weight: bold;
        color: #FFFFFF;
        text-align: center;
        line-height:pxToRem(98);
        background: url(../../assets/svg/y1.svg) no-repeat center center;
        background-size:pxToRem(98) pxToRem(98);
        &.num1{
            background: url(../../assets/svg/y2.svg) no-repeat center center;
            background-size:pxToRem(98) pxToRem(98);
        }
    }
}
 @keyframes fadenum{
   100%{transform:rotate(360deg);}
}
</style>
